1) I have a store called "Job". Is correct that method "getJobStore" is automatically created.
2) in the following code example. I get this error. "this.getJobStore is not a function". When i go console.info(this) i do not see this function. So what property should be "this" ?
onSubmitBtnClick: function () {
var form = Ext.getCmp('formJobSummary');
var record = form.getRecord();
var values = form.getValues();
this.getJobStore().sync();
},
Make sure that you have set the scope properly for your onSubmitBtnClick listener. My guess is that it is running in the scope of your button, not your controller (that is, you haven't specified scope: this in your listener configuration). If you post the configuration of the controller entirely, we would be able to say for sure.
this should be a controller object which is listening the events of this button (as example).
Is that true for you now?
Related
I would like to a pass a record from a grid to a window that I create,
Ext.create('MyWindow',
{recordRef: record}).show();
where record is an argument that is passed into my rowdblclick function but when I try to access recordRef (like below) during debugging, it is undefined.
var me = this;
var record = me.getView().recordRef;
The code fragment above is in a controller for MyWindow.js
The reason this is happening is probably because you are using an event to access recordRef that is called before the constructor assigns recordRef to your window as a property.
My advice would be to use the show event just to be sure, here is a fiddle: https://fiddle.sencha.com/#view/editor&fiddle/232m
You can access custom configs you add to a component with getConfig - in this case it would be this.getConfig('recordRef')
Here's a small fiddle where the custom config is logged to the console, and set to be the window's title.
Refer to this code:
http://plnkr.co/edit/4QpPZZib6qGjhx85Do0M
Here's how to replicate the error:
1. Run the plnkr
2. then click on any of the buttons "200", "300" etc. You will notice that the model updates just fine. No issue so far
3. Now paste something in the input box. The paste should work just fine.
4. Now try clicking on any of the buttons.
ERROR:
You will notice that the values in the input box does not updates to model value.
From what I can understand the issue is with my $render function.. however I can't seem to find a fix for it.
scope.handlePaste = function(e) {
var pastedText = e.clipboardData.getData('text/plain');
ngModelController.$setViewValue(pastedText);
ngModelController.$render = function() {
element.html($sce.getTrustedHtml(ngModelController.$viewValue));
};
return false; //prevent the default handler from running
};
}
You're using ngSanitize but you forgot to include it in the plunker. (lib + injection in app and $sce in directive).
Then element is an angular element and doesn't have an html() function.
You can get the raw html element with element[0] which has a property value.
http://plnkr.co/edit/HSOnscaprbyvUwjr0P2l?p=preview
While transitioning an existing angular site, I encountered an annoying problem. The initial symptom was that a certain controller was not running it's initialize function immediately following the login. I logged and I tracked, and eventually I realized it was a design flaw of the page. Essentially, index.html contains a <header>, <ng-view>, and <footer>. There are a couple of ng-if attributes that live in the header that I want to evaluate after the login, but since the view is the only thing that is reloaded, it was not reinitializing the header controller, and thus not updating the ng-if values.
Then I was reminded of ngInclude, which seems like the perfect solution, until I got it hooked up and realize that doesn't work either. It loads the template the first time, and doesn't reinitialize when the view changes. So then I got the bright idea of passing the HeaderController to another controller or service, and controlling this one stubborn boolean value through a proxy of sorts. That also didn't work. Then I tried putting a function and a boolean into another service, and mirroring that property in the header controller, but thus far I have not gotten this working.
I have done plenty of research about multiple views in the index, and so far I hear a lot about this ui-router, but I'm still not convinced that is the way I want to go. It does not seem to be a simple solution. I have not tried putting the ng-include into the templates yet either, because then I feel like that is going back in time to when we had to update 100 pages every time we changed the menu.
I lost a whole day to this. If anyone could tell me how to trigger the evaluation of this one property in my header controller which I would like to live outside the other templates, please let me know!
Ok so you need to know in your HeaderController when the view has reloaded. There's a number of ways of doing this but the easier and maybe the more correct in this particular case is with an event.
So when you are refreshing the view you just do this, let's say you need the new value of ob1 and ob2 variables.
// ViewController
$rootScope.$emit('viewRefresh', {ob1: 'newvalue1', ob2: 'newvalue2'});
And in your HeaderController you need to listen for that event, and set on your $scope the new values for those attrs (if you're not using controller as syntax).
// HeaderController
$rootScope.$on('viewRefresh', function onRefresh(event, data) {
$scope.ob1 = data.ob1;
$scope.ob2 = data.ob2;
})
Another Solution
Sharing a Promise through a Service (using $q)
function HeaderService($q) {
var defer = $q.defer();
return {
getPromise: function() {return defer.promise},
notify: function(data) {defer.notify(data)}
}
}
function HeaderController(HeaderService) {
var vm = this;
HeaderService.getPromise().then(function(data) {
vm.ob1 = data.ob1;
vm.ob2 = data.ob2;
})
}
function ViewController(HeaderService) {
var data = {ob1: 'newvalue1', ob2: 'newvalue2'};
HeaderService.notify(data)
}
I have a variable that will be used by one or more Controllers, changed by Services.
In that case, I've built a service that keeps this variable in memory, and share between the controllers.
The problem is: Every time that the variable changes, the variables in the controllers aren't updated in real time.
I create this Fiddle to help. http://jsfiddle.net/ncyVK/
--- Note that the {{countService}} or {{countFactory}} is never updated when I increment the value of count.
How can I bind the Service/Factory variable to $scope.variable in the Controller? What I'm doing wrong?
You can't bind variables. But you can bind variable accessors or objects which contain this variable. Here is fixed jsfiddle.
Basically you have to pass to the scope something, which can return/or holds current value. E.g.
Factory:
app.factory('testFactory', function(){
var countF = 1;
return {
getCount : function () {
return countF; //we need some way to access actual variable value
},
incrementCount:function(){
countF++;
return countF;
}
}
});
Controller:
function FactoryCtrl($scope, testService, testFactory)
{
$scope.countFactory = testFactory.getCount; //passing getter to the view
$scope.clickF = function () {
$scope.countF = testFactory.incrementCount();
};
}
View:
<div ng-controller="FactoryCtrl">
<!-- this is now updated, note how count factory is called -->
<p> This is my countFactory variable : {{countFactory()}}</p>
<p> This is my updated after click variable : {{countF}}</p>
<button ng-click="clickF()" >Factory ++ </button>
</div>
It's not good idea to bind any data from service,but if you need it anymore,I suggest you those following 2 ways.
1) Get that data not inside your service.Get Data inside you controller and you will not have any problem to bind it.
2) You can use AngularJs Events feature.You can even send data to through that event.
If you need more with examples here is the article which maybe can help you.
http://www.w3docs.com/snippets/angularjs/bind-value-between-service-and-controller-directive.html
I am trying to create a custom event for my model but apparently the custom event get triggered no matter what unless I use "anonymous" function definition as a callback
Here is the pseudo code of my app structure
//Router
initialize: ->
this.user = new User()
this.view = new View({model:this.user})
this.view.render()
//View
initialize: ->
//This event binding get triggered no matter what
//this.model.on("custom:event", this.triggerMe(), this)
//This works properly. Only triggered when I call model.trigger("custom:event")
this.model.on("custom:event", function(){console.log("I WORK!!");}))
triggerMe: ->
//I GET TRIGGER NO MATTER WHAT
you are invoking a function here:
this.triggerMe()
it should be this.triggerMe
this.model.on("custom:event", this.triggerMe, this)
Adding () or .call() or .apply() is invoking a function not a reference to it.
By passing this.triggerMe() you automatically execute the triggerMe function (because you add parentheses, and by so invocating it).
What you need to do, is to pass a reference to the function. Like so:
this.model.on("custom:event", this.triggerMe, this)