Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
I'm watching this video tutorial on building an e-commerce site with Angular and Moltin. I've gotten to the 19 minute mark where he begins creating the product.html view.
I'm not sure why, but I can console.log(product) just fine, but when I try to use variables like {{ product.title} in my product.html view, it doesn't show. Plain text shows up fine, and in my category.html view I can get my categories to ng-repeat using {{ category.title }} just fine.
I am not sure why I can log the product object, but the view will not render it.
Here's a link to my GitHub repo. Any help is appreciated.
There is a scope conflict being caused because you are declaring product to be your controller with the controllerAs statement here, and then setting $scope.product in your controller here
You need to resolve this conflict by either renaming $scope.product to something else in the controller, or renaming your controllerAs: 'product' statement.
I was able to make this work by changing controllerAs:'product' to controllerAs:'prod', but any solution resolving the conflict between the variable names should work.
Could you provide any snippets or a fiddle of when you initialize products? Just from glancing at the video it seems that the promise from your ProductCtrl might not be fulfilled by the time you are invoking the console.log(); What value are you getting when you console.log()?
Also, although this doesn't seem to be the issue- I have seen the same issue when binding to primitive types!
A simple check could be trying to instantiate the product to an empty object: $scope.product = {}; somewhere in the same context BEFORE you are setting to new value- that way angular's magic will know to watch and bind that object in the digest cycle.
Related
I started a new question because although the last question was answered successfully it has brought about new issues that i cant seem to fix..
i have two factory functions in OrderFunctions
total(menu)
and
totalOrder()
in the app these functions work great however when i try to submit the order form using mandrill in my EmailController. the calculated results are not sent. apart from this it has also seemed to effect the showAlert() function on successful send.
anyway as previously requested here is a plunkr
so the EmailController is in controller.js and you can see the html markup in the order.html
thanks for looking
I want to display the contents from my model in a div which is contenteditable. User will modify this content and it should get saved in my model. I have used the example provided at https://docs.angularjs.org/api/ng/type/ngModel.NgModelController.
The code is available at http://plnkr.co/edit/ruKtNfDWP17npbFU4Te9?p=info
var app = angular.module('docApp', []);
The issue is:
ng-model attribute does not output the data in the div as it does in the input control. Therefore I have to use binding expression.
Because of that editing goes beserk.
How do I get it right?
Thanks.
In my experience contenteditable is extremely tricky for angular to deal with. See this issue on github (which has been open for over 3 years) for a lengthy discussion. You may want to try some third party modules such as akatov/angular-contenteditable.
I am wondering if I am doing something wrong here. The scope variable which provides data to the grid is being updated, as evidenced by the changing data on the page and console output, however the grid does not refresh.
http://jsbin.com/sicasaqe/1/
I note that this question has been asked before, and there is an issue on github, but none of these examples are as basic as this and the suggestions I tried did not help.
I thought I would post a basic example and see what people think.
Thank you for reading.
You should assign the model to your grid this way:
$scope.gridOptions = {
data: 'model.data'
};
I'm using angular translate for i18n.
The particular feature I'm working on is updating the status of a book. In the service callback, if successful, I am updating my book status from, say, Open to Closed. If I view the scope (using Batarang), I can see my DOM element as such:
<span translate="Closed" class="ng-scope">Open</span>
As you can see, the translate value is being updated, but the translation itself isn't occurring on its own. I've read the docs and understand this is expected behavior. What I want to know, though, is how should I be refreshing the translated value?
Presently, I'm injecting the $translate service and executing $translate.refresh() every time I update a scope value that needs to be re-translated. I feel like that's clunky, and probably not the way I should be doing it.
Any thoughts?
You definitely should not issue a refresh for this.
just do something like this:
<span> {book.state | translate} </span>
Given that your book model has a member state to reflect it's state.
Whenever the model changes, the value of state will be re-translated.
Create a common service for translation, this will configure our translation code, in particular it will configure the location of our translation files. Create a directory src/common/translation, and a file src/common/translation/translation.js:
http://technpol.wordpress.com/2013/11/02/adding-translation-using-angular-translate-to-an-angularjs-app/
angular.module('angularTranslateApp', ['pascalprecht.translate'])
.config(function($translateProvider, $translatePartialLoaderProvider) {
$translateProvider.useLoader('$translatePartialLoader', {
urlTemplate: '/UI/assets/translation/{lang}/{part}.json'
}
});
$translateProvider.preferredLanguage('en-AU'); });
I'm using Backbone.js with mustache.js, and I'm loading my templates using ajax. my problem is that the templates are being loaded from cache(refreshing using ctrl+F5 if that matters!). Now I have made changes to the template but it's still loading the old version of it. It's working perfectly fine in incognito. Is there a way to prevent this? Maybe prevent Mustache from caching the template?
The code that renders the template is:
$.get(this.templatesPath + this.template, function(resTemplate){
var html = Mustache.render(resTemplate, that.personData);
that.$el.html(html);
});
My first thought was to use some other function instead of "Mustache.render()" like maybe "Mustache.to_html()". But looking at the
Source Code
reveals that to_html() merely calls render().
Any thoughts?
Apologies for digging up this very old question, but I was searching for the answer to a similar question and didn't end up finding it anywhere. This question is one of the first that shows up when searching "mustache disable caching".
I am using Mustache and Express with the mustache-express module. I was able to disable caching with the following:
const Mustache = require('mustache-express')();
delete Mustache.cache;
I hope this helps someone else in the future.