Javascript 为ng类应用不同的表达式
您好,我正在尝试根据此变量的值更改按钮的颜色:$scope.order.orderwindow.invoicedata 我正在更改ng类中的表达式以执行此操作。然而,尽管我的手表有功能,但现在它并没有改变 指令.jsJavascript 为ng类应用不同的表达式,javascript,angularjs,angularjs-directive,angularjs-ng-repeat,angularjs-service,Javascript,Angularjs,Angularjs Directive,Angularjs Ng Repeat,Angularjs Service,您好,我正在尝试根据此变量的值更改按钮的颜色:$scope.order.orderwindow.invoicedata 我正在更改ng类中的表达式以执行此操作。然而,尽管我的手表有功能,但现在它并没有改变 指令.js .directive('invoicetypewatch', function() { return { restrict: 'A', link: function(scope, element, attrs) { // cha
.directive('invoicetypewatch', function() {
return {
restrict: 'A',
link: function(scope, element, attrs) {
// change styling of button depending on if id is null or not
scope.$watch('order.orderwindow.invoicedata', function() {
if(scope.order.orderwindow.invoicedata.id!=null) {
scope.invoice_delete_type_button_styling={"btn btn-danger btn-block":true};
}else{
scope.invoice_delete_type_button_styling={"btn btn-danger btn-block":false};
}
});
}
};
})
view.html
<div class="col-lg-4" invoicetypewatch>
<button ng-class="{{invoice_delete_type_button_styling}}" ng-click="delete(invoice_delete_type_button,order.orderwindow.invoicedata.id)">{{invoice_delete_type_button}}</button>
</div>
{{发票\删除\类型\按钮}
我无法测试代码,因为我不知道如何更改order.orderwindow.invoicedata
,但我的建议是完全删除监视
,并将视图更改为:
<div class="col-lg-4" invoicetypewatch>
<button ng-class="{'btn btn-danger btn-block':(scope.order.orderwindow.invoicedata.id!=null)}"
ng-click="delete(invoice_delete_type_button,order.orderwindow.invoicedata.id)"> {{invoice_delete_type_button}}</button>
</div>
{{发票\删除\类型\按钮}
这可能有效,但仍取决于
order.orderwindow.invoicedata
的更改方式。确保更改发生在angular应用程序内部,并开始一个新的摘要循环。我认为您只需在指令中指定类-无需映射对象:
if(scope.order.orderwindow.invoicedata.id!=null) {
scope.invoice_delete_type_button_styling="btn btn-danger btn-block";
}else{
scope.invoice_delete_type_button_styling="btn btn-success";
}
然后只需在ng类中使用该范围变量,而不使用{{},因为ng类对传入的内容求值
<button ng-class="invoice_delete_type_button_styling"
<button class="{{invoice_delete_type_button_styling}}"