Question

问题：如何根据此人的性别选择正确的选项。

1）我试图将信息放在指令中，以便我可以在页面上有多个选择..这个将读取性别值。我把ng-if放在那里，因为在我读出这个人的性别之前，指令正在加载。（可能有更好的方法来处理这个问题）

MarkUP
<label>Gender:</label>
<directive-dropdown ng-if="$ctrl.PersonOC.GENDER"  id="ddlGender" entity-name="GENDER" dd-value="true" selected-value="{{$ctrl.PersonOC.GENDER}}"></directive-dropdown>

2）在指令中，我从服务中读取选项。但我不知道如何选择＆＃39; M＆＃39;。

Directive
var dropdownApp = angular.module('dropdownApp', ['core.pvms']);


dropdownApp.directive('directiveDropdown', function () {
return {
    restrict: 'E',
    scope: {
        entityName: '@',
        ddValue: '@',
        selectedValue: '@',  
        ngModel: '='
    }
    ,template: '<select ng-model="selectedOption" ng-options="option.DROP_DOWN_VALUE for option in pvmsOptions track by option.CD">' +   
                '<option value="">-- select one --</option></select>'
    ,replace: true
    ,controller: ['$scope', 'pvmsService', function ($scope, pvmsService) {
        var paramsObj = {};
        paramsObj.entityName = $scope.entityName;
        paramsObj.ddValue = $scope.ddValue;

        $scope.pvmsOptions = pvmsService.query(paramsObj);
        if ($scope.ngModel != '') {
            $scope.ngModel = $scope.selectedValue;
        }
    } ]
    ,link: function ($scope, element, attrs) {
        $scope.ngModel = $scope.selectedValue;
    }
};
});

3）你可以在渲染的html中看到第一个选项被选中，而不是＆＃39;男性＆＃39;

Rendered Html
<select ng-model="selectedOption" ng-options="option.DROP_DOWN_VALUE for option in pvmsOptions track by option.CD" 
ng-if="$ctrl.PersonOC.GENDER" id="ddlGender" entity-name="GENDER" dd-value="true" selected-value="M" 
class="ng-pristine ng-untouched ng-valid ng-scope ng-isolate-scope ng-empty">
<option value="" class="" selected="selected">-- select one --</option>
<option label="FEMALE         " value="F">FEMALE         </option>
<option label="MALE           " value="M">MALE           </option>
</select>

Answer 1

您可以在指令上使用require: 'ngModel'来访问ngModelController。从那里，您可以使用ngModelController的{{1}}和$setViewValue方法。

$commitViewValue

Answer 2

一个问题是承诺尚未完成......所以在链接中我添加了逻辑来检查数据是否存在。在成功之后，我通过pvmsOptions循环并将ngModal设置为适当的。

, controller: ['$scope', 'pvmsService', function ($scope, pvmsService) {
        var paramsObj = {};
        paramsObj.entityName = $scope.entityName;
        paramsObj.ddValue = $scope.ddValue;

        $scope.pvmsOptions = pvmsService.get(paramsObj);

    } ]
            ,link: function ($scope, element, attrs, ngModelCtrl) {                   

                    //put this here to wait until the data has been actually read.
                    $scope.pvmsOptions.$promise.then(function(data) {
                        //console.log(data);

                        //loop thru and select the value from the db.
                        angular.forEach($scope.pvmsOptions, function (s) {
                                if (s.CD == $scope.selectedValue) {
                                $scope.ngModel = s;
                                }});

                    });
              },

Angularjs指令并未选择正确的选项

2 个答案: