ng-model 在 select 指令中不起作用

Question

工作原理： ng-options 包含所有名称并显示在下拉列表中。

问题：

开头如果没有selected，应该显示文本"Select name..."。但现在是空的。
我知道很多人都问过这个问题，但我没有找到解决这个问题的方法。如果我将 select 其中一些选项错误

"Error: [$compile:nonassign] Expression 'undefined' used with directive 'fileWidget' is non-assignable!" occured.

GeometryService.js

angular.module('COMLEAMclient')
.factory('GeometryService', function($resource) {

  var selectedGeometry = {name:'Select name...'};
}

FileWidgetDirective.js

angular.module('COMLEAMclient')
.directive('fileWidget', ['$log', '$parse', function($log, $parse) {

        return {
            scope: {
                data: '=',
                selectedFile: '=',
                updateSelection: '&',
                selected: '=',
                onReadFile: '&',
            },
           ....
        }
    )
}

InputController.js

<div file-widget data="iCtrl.geometryFiles"  update-selection= "iCtrl.setSelectedGeometry(name)" selectedFile= "iCtrl.selectedGeometryFile" on-read-file="iCtrl.saveGeometryFiles(file,name)"></div>

FileWidget.html

<select class="form-control"
    ng-options="elem.name for elem in data"
    ng-model="selectedFile"
    ng-change="onSelectionChange()">
</select>

有什么想法吗？

Answer 1

为了拥有 Select name... 你需要有一个 option 元素：

<select class="form-control"
    ng-options="elem.name for elem in data"
    ng-model="selectedFile"
    ng-change="onSelectionChange()">
    <option value="">Select name...</option>
</select>

您正在尝试分配给一个不可分配的对象，这就是您收到 non-assignable 错误的原因。你需要有一个变量可以包含所选选项的值，试试：

ng-model="selectedFile.name"

ng-model 在 select 指令中不起作用

ng-model does not work in select directive

angularjs

angularjs-directive

angularjs-model