Is it possible in AngularJS to use data bindings inside a classic javascript function?
UPDATE:
// i changed: fillName({{name}}); with:
fillName('{{name}}');
and this solved the error... but still the name doesn't appear... i'm still working on this...
suggestions always welcome!
解决方案
[Update] Well, it appears that I misunderstood your question, as you seem to have solved your issue, but perhaps other people will stumble upon this information based on the title of the question.
I will prefix my answer with the following caveat: if you're writing an AngularJS application, you'll want to use the features Angular provides, like directives, for doing this kind of stuff, rather than going outside the Angular application lifecycle and writing global functions, etc. In the interest of the academic answer to the question, however, here it is.
Overview
The Angluar magic that you're trying to get access to here is based on a few facilities:
Scopes provide a context for Angular expressions (the things you put in attributes and the double curlies) and provide the functions necessary to watch for changes in the evaluation of these expressions in that context. For example, Scope#$watch allows you to register a callback that is executed whenever the evaluation of an expression changes.
Interpolate takes a string that can include expressions inside double curlies and turns it into a new string with the expression results interpolated into the original string. (Calling $interpolate(str) returns a function which, when called against an object that provides scope, returns a string.)
Putting it Together
When writing an Angular app, you often don't have to worry about these details--your controllers automatically get passed a scope, and your DOM text is automatically interpolated. Since you're trying to access these things outside of the lifecycle of an Angular app, you'll have to jump through some of these previously hidden hoops.
When you register services, filters, directives, etc. on a module using app.controller, app.factory, and so forth, the functions you provide are invoked by the injector. Angular creates one for you in an Angular app, but since we're not using one, you'll need to use angular.injector to create one yourself.
Once you have an injector, you can use injector.invoke(fn) to execute the function fn and inject any dependencies (like $interpolate) for use inside the function.
A simple example
Here's a very basic example that
Provides two-way data binding between an input and a variable
Provides data binding into an HTML view using $interpolate
Name: <input id="name" type="text" autocomplete="off">
<button id="setname">Set name to Bob</button>
<div id="greeting"></div>
var injector = angular.injector(['ng']);
injector.invoke(function($rootScope, $interpolate) {
var scope = $rootScope.$new();
var makeGreeting = $interpolate("Hello {{name}}!");
scope.$watch('name', function() {
var str = makeGreeting(scope);
$("#greeting").text(str);
$("#name").val(scope.name);
});
var handleInputChange = function() {
scope.$apply(function() {
scope.name = $('#name').val();
});
};
var setNameToBob = function() {
scope.$apply(function() {
scope.name = "Bob";
});
};
$("#name").on('keyup', handleInputChange);
$("#setname").on('click', setNameToBob);
handleInputChange();
});
