Question

我有一个父子控制器关系。这是基本功能的非工作模型。我相信比我更有能力的人可以让它适用于Plunker或Fiddle模型。（所以可能有问题： $ scope.data.contactList = [{ID：1，电子邮件：“someemail@email.com”}，{ID：2，电子邮件：“anotheremail@email.com” }]; ）我尝试为contactList数组创建一些对象。

反正。我希望能够单击下面代码中第二个表中的链接来调用EditShowContact。在我的实际应用中，这将显示一个隐藏的div，它显然会显示联系人的更多属性，而不仅仅是电子邮件。

在我的实际程序中，表的值被正确填写（即我的ng-repeat指令工作正常），但我似乎无法得到ng-model指令来响应。我尝试了各种不同的方式，似乎没有任何工作。

<html ng-app="myApp"><head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script>

var app = angular.module('myApp', []);

app.controller('ContactsController', function ($scope)
{   
    this.currentContactID = null;
    this.EditShowContact = function(intContactID)
    {   
        this.currentContactID = intContactID;
        //this.currentContact = $scope.data.contactList[intContactID]; unclear why this assignment fails
    };
});

app.controller('ActionsController', function ($scope)
{   $scope.data = {}; 
    $scope.data.contactList = [{ID: 1, Email: "someemail@email.com"}, {ID: 2, Email: "anotheremail@email.com"}];    
});

</script>
</head>
<body ng-controller="ActionsController as ActCtrl">

<div ng-controller="ContactsController as ContactsCtrl">
    <table border = "1";>
        <tr><th>Email</a></th>
            <th>Name</th></tr>
    </table>
    <div >
        <table  ng-repeat="Contact in ContactsCtrl.data.contactList" border="1">
            <tr>
                <td><a href="" ng-click="ContactsCtrl.EditShowContact(Contact.ID)" style="padding-left: 5px;">{{Contact.Email}}</a></td>
                <td>{{Contact.Name}}</td>
            </tr>
        </table>
    </div>
    <div>
        <form>
            <input type="input" ng-model="ContactsCtrl.data.contactList[currentContactID].Email"></input>
        </form>
    </div>
</div>
</body>
</html>

Answer 1

这里有很多错误，例如：

ContactsCtrl没有关于ContactList的信息。您正试图使用index中的<table>内部<div>以及更多内容使用ID来查找数组中的对象。

基本上，我已经将两个控制器的需求减少到一个并且Working Demo。

Angularjs：ng-model显示不正确

1 个答案: