更新

Question

这是我的scope.projectArr数组

scope.projectArr = [  
   {  
      "proName":"fffff",
      "proId":"12"
   },
   {  
      "proName":"project 0001",
      "proId":"13"
   },
   {  
      "proName":"ABC website",
      "proId":"7"
   }
];

我再次拥有另一个具有名为project的属性且包含字符串值

的对象

$scope.timesheet = {};
$scope.timesheet.project = "ABC website";

我的问题是我想要所有数组元素作为选项并预先选择基于$scope.timesheet.project值的选项。我尝试使用ng-model-options="{trackBy: $value.proName}"但无法这样做

这是html

<md-select placeholder="Project" ng-model="timesheet.project" 
   flex  ng-model-options="{trackBy: $value.proName}">
   <md-optgroup label="Project">
   <md-option  ng-repeat="item in projectArr"  ng-value="item">{{item.proName}}    </md-option>
</md-select>

我尝试在ng-value中使用大括号，但结果相同。

我查看inspect元素以检查值是否分配给选项但是显示为[object object]

`

请注意我使用的是角质材料，据我所知ng-option在材料中没有。

不要被图片中的vm.projectArr混淆。我在我的应用程序中使用控制器，但为了简单起见，我将此问题作为范围变量发布。

Answer 1

更新

您可以使用如下所示的ng-model-options：
你错过了trackBy表达式的引用

<md-select placeholder="Project" ng-model="timesheet.project" flex ng-model-options="{trackBy: '$value.proName'}">
  <md-optgroup label="Project">
    <md-option ng-repeat="item in projectArr" ng-value="item">{{item.proName}} </md-option>
</md-select>

在您的控制器中使用以下：

$scope.timesheet = {
    'project': {
        'proName': "ABC website"
    }
};

Updated Plunker

我能够通过

使其工作

$scope.timesheet = {
    'project': arrFilter($scope.projectArr, 'proName', 'ABC website')[0]
};

arrFilter方法：此方法采用array，property name，property value并从对象数组中返回数组。

function arrFilter(arr, prop, val) {
    return arr.filter(function(v) {
        debugger;
        return v[prop].indexOf(val) > -1
    }) || [];
}

工作演示

Plunker

说明：

由于您选择获取对象，因此您应该提供arrFilter正在执行的same object reference 这样做的原因是，在javascript对象中，比较是通过引用而不是值来完成的。示例：

{} never equals to {}

但是a = {}，b = a和a equals b

Answer 2

试试这个， ng-value =＆＃34; item.proId＆＃34;

<md-select placeholder="Project" ng-model="timesheet.project" 
   flex  ng-model-options="{trackBy: $value.proName}">
   <md-optgroup label="Project">
   <md-option  ng-repeat="item in projectArr"  ng-value="item.proId">{{item.proName}}    </md-option>
</md-select>

Answer 3

应该是这样的

$scope.timesheet = {};
$scope.timesheet.project = $scope.projectArr[0];

<强> 编辑：

 <md-select placeholder="Project" ng-model="timesheet.project" >
   <md-option  ng-repeat="item in projectArr"  
    ng-value="item.proName">     {{item.proName}} </md-option>
 </md-select>

并像这样初始化

 $scope.timesheet.project = $scope.theStringValue; //ABC website

或类似于此

  <md-select placeholder="Project" ng-model="timesheet.project" >
   <md-option  ng-repeat="item in projectArr"  
    ng-value="item.proId">     {{item.proName}} </md-option>
 </md-select>

和默认选择值

   angular.forEach($scope.projectArr,function(proj){
      if(proj.proName == $scope.theStringValue)
        $scope.timesheet.project = proj.proId;
   })

Answer 4

在控制器中初始化模型

$scope.timesheet.project = $scope.projectArr[2]

或者在您的视图中

<div ng-init="timesheet.project = projectArr[2]">
    <md-select placeholder="Project" ng-model="timesheet.project" flex>
       <md-optgroup label="Project">
       <md-option  ng-repeat="item in projectArr">{{item.proName}}</md-option>
    </md-select>
</div>

这会将其初始化为第3个对象并显示“ABC网站”

使用ng-model-options预选选项

4 个答案:

更新

工作演示

说明：