Я начинаю использовать angularjs, и у меня есть проблема, может быть, потому, что я злоупотребляю им. У меня есть представление, связанное с массивом объектов; Я хочу определить свойства и методы этих объектов в viewModel, используя функцию конструктора для свойства и методы добавления к прототипу. Вот Javascript ViewModel:Binding throw angularjs для прототипов методов
var CDLViewModel = function(name, operator, state) {
this.Name = name;
this.Operator = operator;
this.State = state;
this.LockEnabled = false; // some logic based on the state here
};
CDLViewModel.prototype = {
StartEnabled: function() {
return false; // some logic based on the state here
}
};
В этом ViewModel у меня есть два метода, которые управляют, если некоторые кнопки включены: один определяется в конструкторе, а другой в прототипе. Я хочу определить все методы только в прототипе, но угловые, похоже, не видят здесь методов. В моем контроллере я загружаю некоторые данные с сервера, а затем заполняю массив viewModels; если я отлаживать массив я могу видеть объекты с помощью метода StartEnabled в прототипе:
function myController($scope, $http, $rootScope) {
if (!$rootScope.cdls) {
$rootScope.cdls = [];
$http.get("http://localhost:8080/...")
.then(function(result) {
for (var i = 0; i < result.data.length; i++) {
$rootScope.cdls[i] = new CDLViewModel(result.data[i].Name, result.data[i].Operator, result.data[i].State);
}
},
function() {
alert("ko");
});
}
};
В представлении у меня есть этот код, перебираем массив и связать некоторый входной сигнал и состояние кнопки для каждого ViewModel ; по какой-то причине кнопка, привязанная к методу LockEnabled, работает, а кнопка, привязанная к методу StartEnabled, всегда отключена. Вот выдержка из обзора:
<tabset>
<tab data-ng-repeat="cdl in cdls" heading="{{cdl.Name}}" >
Operator: <input type="text" data-ng-model="cdl.Operator"/>
<a class="btn btn-primary btn-lg btn-block" href="#/start" data-ng-disabled="cdl.StartEnabled" >Start</a>
<a class="btn btn-primary btn-lg btn-block" href="#/lock" data-ng-disabled="cdl.LockEnabled">Lock</a>
Вторая кнопка (ссылка) работает, первый из них нет.
Я думаю, что это 'data-ng-disabled =" cdl.StartEnabled "должно быть' data-ng-disabled = "cdl.StartEnabled()" 'в обоих местах. – Chandermani
Спасибо, ты прав. Я предполагал это, и я пытался, но в то время у меня была другая проблема, и в правде я пробовал только версию без круглых скобок! Теперь он работает! –