0

是否可以为 ngInclude 指定模型，以便在包含的模板内完成的任何更改都反映在指定的模型上。例如：

我有一个模型，例如：

$scope.member = {

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

和模板：

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

现在是否可以传递 ngInclude “成员”或任何子项并修改其各自的名称属性？我尝试将 ng-model 传递给 ng-template 但它不起作用。我尝试使用预期模型动态加载范围，但如果模型被删除，我会留下一个孤立模板。以下是jsfiddle代码：

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

我希望重用模板，而不是为不同的模型复制相同的模板。我已经提到了这个问题：

如何在 AngularJS 中为 ngInclude 指令指定模型？

但是这里的模型没有被删除。

编辑

到目前为止，我还没有掌握创建自定义指令的概念。但是是否会结合 ng-include 帮助创建一个新指令？

4

1 回答 1

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'应该没问题。

这就是你想要的？

于 2013-03-29T13:24:44.470 回答