Geek asks and answers

AngularJS and generated elements

We have some third-party javascript components that generate some html elements. I would like to associate it with AngularJS.

I tried this code

<div ng-controller="ExpensesCtrl">
    <form id="expensesform">
        <input type="text" ng-model="expense.name" />
        <input type="text" ng-model="expense.amount" />
    </form>
    <button ng-click="add()">Add</button>expense | json
</div>

function ExpensesCtrl($scope) {

    $scope.expense = {};
    $scope.add = function () {
        $("#expensesform").append("<input type='text' ng-model='expense.age' />");
    };
}

http://jsfiddle.net/tChNh/

but it does not work as excluded.

Is there a chance to get this job?

+5
source share
3 answers

This is the wrong way to do this, but for this particular scenario you want to do something like this: http://jsfiddle.net/wXZL7/1 . Add a $ compile service.

Again, this is not the right way to do this with Angular. Angular thing: "You don’t need to mess with the DOM in your controller, let HTML and directives do this."

, , , . : http://docs.angularjs.org/guide/directive

+13

angular, , http://jsfiddle.net/3BVMm/1/

, , , angular ...

+1

: HTML

Maybe this helps others. It describes how to use the service $compileto get Angular, to learn about the known code.

0
source

More articles:


All Articles