Question

我在html中的ng-model 中有一个点。我们来看看

step1.html文件

<div class="col-xs-12 col-sm-9">
    <select id="plateId" ng-model="selectedPlate.plate" ng-options="plate.id as (plate.wafer_id + ' - ' + plate.serial_number) for plate in plates" />
    <option value="">Select</option>
    </select>
</div>

它只是一个使用ui-router的表单向导。

这是我的其他html文件。在步骤3中，用户按下按钮。

<button class="btn btn-success btn-next" ng-click="storePlatesInspection()">
    Submit
    <i class="ace-icon fa  icon-on-right"></i>
</button>

我的控制器看起来像这样。

angular.module('sxroApp')
    .controller('plateInspectionCtrl', function ($scope, PlatesInspectionFactory, PlatesFactory, PlateQualityFactory, EquipmentStatusCodesFactory, PlateContainersFactory, $location) {
    // object to hold all the data for plate inspection
    $scope.data = [];

    $scope.selectedPlate = {};

    $scope.inspectionData = {

        equipment_status_codes_id: 1,
        plate_container_id: 1,
        plate_container_slot: 34,
        plate_quality_id: 1

    }

    PlatesFactory.query(function (plates) {
        $scope.plates = plates;

    });

    /*    $scope.getSelectedPlate = function(plate)
            {
              $scope.data.push({

                  plate_id : plate.id
             });*/

    //  console.log($scope.selectedPlate.id)
    //alert(item.wafer_id)
    //PlatesInspectionFactory.update( {id : $scope.plateid[0].plate_id}, $scope.inspectionData)

    PlateQualityFactory.query(function (platequality) {
        $scope.platequality = platequality;

    })

    PlateContainersFactory.query(function (plateContainers) {
        $scope.plateContainers = plateContainers;

    });

    EquipmentStatusCodesFactory.query(function (statuscodes) {
        $scope.statuscodes = statuscodes;
    });

    $scope.storePlatesInspection = function () {

        alert($scope.selectedPlate.plate.id); // not working
        alert($scope.selectedPlate.plate.$id); // not working

    }
});

我也试过

alert($scope.selectedPlate.plate); // undefined is the result.

我基本上遵循了这位先生所说的话

Ng-model does not update controller value

有人会告诉我我做错了什么吗？

这是form

形式的图像

我正在尝试使用该模型来获取用户在向导过程中所做的选择。

更新＃1 ：我已更新上述代码。

Answer 1

将您的HTML更改为

<select id="plateId" 
        ng-model="selectedPlate.plate" 
        ng-options="plate for plate in plates"/>
     <option value="">Select</option>
</select>

查看ddl bindings

的不同方式

Answer 2

我不确定为什么alert($scope.selectedPlate.plate);无法正常工作，但您将ID属性的值传递给$scope.selectedPlate.plate，因此它不会保留＆＃34;盘子对象＆＃34;如果有ID属性，它只是一个数字（或任何ID）。

Answer 3

之前我没有使用过ui-router，但可能是你已经指定了一个指令或路由路径以及controllerAs属性。如果指定了controllerAs，那么存储在控制器中$ scope上的变量将通过视图html中的controllerAs值进行访问。

例如，如果指令声明为：

angular.module('sxroApp')
    .directive('plateInspectionDirective', function () {
        return {
            restrict: 'A',
            templateUrl: 'plateInspection.html',
            controller: plateInspectionCtrl,
            controllerAs: 'plateInspection',
            scope: {
            }
        };
    });

然后视图将需要控制器名称plateInspection来访问其范围内的变量。

<div class="col-xs-12 col-sm-9">
<select id="plateId" ng-model="plateInspection.selectedPlate.plate" ng-options="plate.id as (plate.wafer_id + ' - ' + plate.serial_number) for plate in plateInspection.plates" />
<option value="">Select</option>
</select>

ng-model在控制器中未定义

3 个答案: