[英]Angular Material md-select not binding
Hello all thanks for reading, i'm having a issue with Angular Material md-select 大家好,感谢您阅读,我遇到了Angular Material md-select的问题
it doesn't bind with my model. 它不会与我的模型绑定。 i'm using it to make a form to update data of this model.
我用它来制作一个表格来更新这个模型的数据。
<md-input-container class="md-icon md-block" flex ng-controller="ProveedorController" data-ng-init="listaProveedores()">
<label>Proveedor</label>
<md-select ng-model="detalle.proveedor" required name="proveedores">
<md-option ng-value="proveedor" ng-repeat="proveedor in proveedores">{{proveedor.nombreProveedor}}</md-option>
</md-select>
i've tried to use ng-selected
but it bind another object that doesn't fit with the original of the model. 我试图使用
ng-selected
但它绑定另一个不符合模型原始的对象。
any idea what i'm doing wrong? 我知道我做错了什么?
Ok, after a good sleep and hours of searching i've found the solution of this. 好吧,经过良好的睡眠和数小时的搜索,我找到了解决方案。
to keep track of the objects i need to add a property on my md-select 跟踪我需要在我的md-select上添加属性的对象
in this case something similar to this: ng-model-options="{trackBy: '$value.id'}"
在这种情况下类似于:
ng-model-options="{trackBy: '$value.id'}"
<md-input-container class="md-icon md-block" flex ng-controller="ProveedorController" data-ng-init="listaProveedores()">
<label>Proveedor</label>
<md-select ng-model="detalle.proveedor" required name="proveedores" ng-model-options="{trackBy: '$value.idProveedor'}">
<md-option ng-value="proveedor" ng-repeat="proveedor in proveedores">{{proveedor.nombreProveedor}}</md-option>
</md-select>
</md-input-container>
now all my models are display fine. 现在我的所有型号都显示得很好。 Thank you for reading and sorry if i waste your time.
感谢您的阅读,如果我浪费您的时间,请抱歉。
I've experienced this first hand and attempted different solutions to no avail. 我亲身体验了这一点并尝试了不同的解决方案无济于事。 The ultimate fix was using a controller instance variable instead of $scope to hold the ng-model value.
最终修复是使用控制器实例变量而不是$ scope来保存ng-model值。
Instead of referencing $scope.somemodel
to retrieve the updated model value, use this.somemodel
. 请使用
this.somemodel
,而不是引用$scope.somemodel
来检索更新的模型值。
Here you go - CodePen 你去吧 - CodePen
Markup 标记
<div ng-app="MyApp" ng-controller="ProveedorController">
<md-input-container class="md-icon md-block" flex data-ng-init="listaProveedores()">
<label>Proveedor</label>
<md-select ng-model="detalle.proveedor" required name="proveedores">
<md-option ng-value="proveedor.nombreProveedor" ng-repeat="proveedor in proveedores">
{{proveedor.nombreProveedor}}
</md-option>
</md-select>
</md-input-container>
<br>
Proveedor: {{detalle.proveedor}}
</div>
JS JS
angular.module('MyApp',['ngMaterial', 'ngMessages', 'material.svgAssetsCache'])
.controller('ProveedorController', function($scope) {
$scope.proveedores = [
{nombreProveedor: "Daffy"},
{nombreProveedor: "Mickey"},
{nombreProveedor: "Goofy"}];
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.