tôi đã viết một số mã đơn giản trên http://jsfiddle.net/gsche/1/AngularJS dữ liệu ràng buộc không làm việc
Khi tôi bấm vào liên kết "Làm mới", các "customer.name" mô hình không cập nhật xem.
Tôi đã viết mã trên máy tính cục bộ của mình và gỡ lỗi mã đó bằng Batarang trong Chrome.
Bảng điều khiển không hiển thị bất kỳ lỗi nào. Trang Mô hình ở Batarang cho thấy tên khách hàng thay đổi ở bên phải, được liên kết với id phạm vi cũ, nhưng id của $ scope cũng thay đổi.
Có ai có thể chỉ cho tôi đúng hướng không?
<div ng-app>
<div ng-controller="MainCtrl">
<p> <a href="#" ng-click="Refresh()">Refresh</a> </p>
<p>
<input type="text" ng-model="customer.name">
</p>
<p>{{ customer.name }}</p>
</div>
</div>
function MainCtrl($scope) {
$scope.customer = {
name: 'TTT',
id: 0
};
$scope.Refresh = function ($scope) {
$scope.customer.name = 'Test';
};
}
Cập nhật 1 2013/08/08 Cảm ơn tất cả các bạn (@EpokK, @Stewie, @Hippocrates). Tôi undestand bây giờ vấn đề với jsfiddle, và ví dụ hoạt động như nó cần.
Tuy nhiên, trong ứng dụng thử nghiệm của tôi, liên kết {{customer.name}} hoạt động nhưng nhấp "Làm mới" vẫn không thay đổi {{customer.name}} trong chế độ xem.
Đây là nội dung của đơn đăng ký của tôi. Tôi nghĩ rằng đó là giống như ví dụ jsfiddle:
index.html
<!doctype html>
<head>
<title>Test</title>
</head>
<body ng-app="roaMobileNgApp">
<script src="scripts/angular.js"></script>
<script src="scripts/angular-ui.js"></script>
<link rel="stylesheet" href="scripts/angular-ui.css">
<div class="container" ng-view=""></div>
<script src="scripts/app.js"></script>
<script src="scripts/controllers/main.js"></script>
</body>
</html>
app.js
'use strict';
angular.module('roaMobileNgApp', ['ui'])
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl'
})
.otherwise({
redirectTo: '/'
});
});
main.js
'use strict';
angular.module('roaMobileNgApp')
.controller('MainCtrl', function ($scope) {
$scope.customer = {name: '',
id: 0};
$scope.getDetails = function() {
$scope.customer.name = 'Test';
};
});
main.html
<div ng-controller="MainCtrl">
<a href="#" ng-click="getDetails()">Refresh</a>
<p><input type="text" ng-model="customer.name"> {{ customer.name }} </p>
</div>
Cảm ơn tất cả các bạn. Vấn đề jsfiddle được giải quyết, nhưng liên kết "Làm mới" trong ứng dụng của tôi vẫn không cập nhật "customer.name". Tôi đã cập nhật câu hỏi của mình với các tệp nguồn. –
Tôi đã có câu trả lời cho vấn đề của mình. A href = "#" đã làm cho trang làm mới. Nếu có ai có cùng sự cố, hãy xem http://stackoverflow.com/questions/18127523/ng-click-does-not-update-model –
Đó là HTML5 hợp lệ để không yêu cầu HREF trong phần tử liên kết để bạn có thể xóa nó. –