Geek asks and answers

Snap to multiple models

Is it possible to specify a model for ngInclude so that any changes made inside the included template are reflected in the specified model. For instance:

I have a model, for example:

$scope.member = {

    name: "Member1",
    children:[
    {
        name:"Child1"
    },
    {
        name:"Child2"
    }
    ]
};

and template:

<script type="text/ng-template" id="name.html">
    <input type="text" ng-model="member.name"/>
</script>

Now can you pass ngInclude either a "member" or any child and change their corresponding name properties? I tried passing the ng model to the ng template, but this will not work. I tried to dynamically load the area with the intended model, but if the model is deleted, I will remain an orphaned template. Below is the jsfiddle code:

http://jsfiddle.net/vaibhavgupta007/p7E5K/

I want to reuse a template, and not duplicate the same template for different models. I referred to this question:

How to specify model in ngInclude directive in AngularJS?

But here the models are not deleted.

Edit

. ng-include?

0
1

: . . .

: http://jsfiddle.net/vgWQG/1/

:

Member: <member model="member"></member>
<ul>
    <li ng-repeat="child in member.children">
        Child {{$index}}: <member model="child"></member>   
    </li>
</ul>

:

app.directive('member', function(){
return {
    template : '<input type="text" ng-model="member.name"/>',
    replace : true,
    restrict: 'E',
    scope : {
        'member' : '=model'
    },
    link: function(scope, element, attr) {}
};

});

, jsfiddle. , templateUrl: 'name.html' .

, ?

+1

More articles:


All Articles