绑定ngInclude不同车型 [英] Bind ngInclude to different models

问题描述

是否有可能为ngInclude指定模式，使包括模板中做任何更改都在指定的模型体现。例如：

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

我有一个模型，如：

$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-模式向NG-模板，但它不工作。我试图动态加载的范围与预期的模式，但如果模型得到删除，我留下一个孤儿的模板。以下是的jsfiddle code：

Now is it possible to pass ngInclude either "member" or any child and get their respective name properties modified? I tried passing ng-model to the ng-template but it doesn't work. I tried to dynamically load the scope with the intended model but if the model gets delete, I am left with an orphan template. Following is the jsfiddle code:

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

我想重新使用该模板而不是重复用于不同型号相同的模板。我曾经所指向这个问题：

I wish to reuse the template rather than duplicating the same template for different models. I have refered to this question:

<一个href=\"http://stackoverflow.com/questions/13422966/how-to-specify-model-to-a-nginclude-directive-in-angularjs\">How指定模型在AngularJS一个ngInclude指令？

但这里的模型都没有得到删除。

But here models are not getting deleted.

修改

我还没有掌握到现在为止创建自定义指令的概念。但在创造与一起选择一个新的指令NG-包括帮助？

I have not grasped the concepts of creating custom directives till now. But will creating a new directive in conjuction with ng-include help?

推荐答案

您最后一个问题的答案是：是的。在指令中，还定义了一个模板和范围。范围的内容是完全在你的手中。

The answer of your last question is: yes. In a directive, you define also a template and a scope. The content of the scope is completely in your hands.

在这里看到： 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的应该是罚款

I've moved the template in an inline variant because I could not getting the template cache getting to work in jsfiddle. In a real world, a templateUrl: 'name.html' should be fine.

这是你想要的吗？

这篇关于绑定ngInclude不同车型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！