0

此代码示例在此小提琴http://jsfiddle.net/viralpatel/aLDJJ/中不起作用，但在同一作者的演示中起作用：http: //viralpatel.net/blogs/angularjs-controller-tutorial/。由于它在我的小提琴上也失败了，我很感激任何关于正在发生的事情的见解。

    <!DOCTYPE html>
<html ng-app>
<head>
<title>Hello World, AngularJS - ViralPatel.net</title>
<script type="text/javascript"
    src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
</head>
<body>
<div ng-controller="ContactController">
     Email:<input type="text" ng-model="newcontact"/>
    <button ng-click="add()">Add</button>
    <h2>Contacts</h2>

    <ul>
        <li ng-repeat="contact in contacts"> {{ contact }} </li>
    </ul>

</div>
<script type="text/javascript">
    function ContactController($scope) {
        $scope.contacts = ["hi@email.com", "hello@email.com"];

        $scope.add = function() {
        $scope.contacts.push($scope.newcontact);
        $scope.newcontact = "";
        }
    }
</script>
</body>
</html>
4

2 回答 2

1

ng-model你的是input，contact在它正在寻找的功能中$scope.newcontact。改变这个，它的工作原理：http: //jsfiddle.net/aLDJJ/157/

function ContactController($scope) {
    $scope.contacts = ["viralpatel.net@gmail.com", "hello@email.com"];

    $scope.add = function() {
        $scope.contacts.push($scope.contact); //Changed here
        $scope.contact = ""; //Changed here
    }
}

<input type="text" ng-model="contact" />
于 2013-10-08T12:59:30.580 回答
0

您的小提琴有一个contact 绑定到范围的不同变量。您要放入联系人数组的变量newcontact未在范围中定义。我更改了对这个变量的所有引用，并newContact为清楚起见调用了它。

这个小提琴可以工作：http: //jsfiddle.net/GruyereEmmentaler/aLDJJ/158/

<div ng-app="" ng-controller="ContactController">

        Email:<input type="text" ng-model="newContact" />

        <button ng-click="add()">Add</button>

        <h2>Contacts</h2>
        <ul>
            <li ng-repeat="contact in contacts"> {{ contact }} </li>
        </ul>

    </div>

和javascript：

function ContactController($scope) {
    $scope.contacts = ["viralpatel.net@gmail.com", "hello@email.com"];

    $scope.add = function() {
        $scope.contacts.push($scope.newContact);
        $scope.newContact = "";
    }
}
于 2013-10-08T13:05:11.960 回答