AngularJS: выбранные радиокнопкой значения возвращаются неопределенными в контроллере - PullRequest
Новая
       1

AngularJS: выбранные радиокнопкой значения возвращаются неопределенными в контроллере

0 голосов
/ 28 июня 2019

Я создал директиву ng-repeat для предоставления списка переключателей и попытался получить доступ к выбранному пользователем значению в контроллере, но значения, которые я получаю, не определены. Это код с платформы servicenow, пожалуйста, дайте мне знать, что случилось. 

<div>
    <!-- your widget template -->
    <div class= "panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title" align="center">
                Select the options below to make a request:
            </h3>
        </div>
        <body>
            <div class="btn-group btn-group-justified">
                <div ng-repeat="item in data.items">
                    <input type="radio" 
                           name="item" 
                           data-ng-model="$parent.item" 
                           ng-checked="$first" 
                           id="{{::item.name}}" 
                           ng-value="{{::item.sys_id}}">
                    <label class="form-check-label" align="center">
                        <h5> {{::item.name}}</h5>
                    </label>
                </div>
                <div>
                    <input type="radio" 
                           name="select-service" 
                           ng-model="result" 
                           id="service3" 
                           ng-value="'Other'">
                    <label class="form-check-label" align="center">
                        <h5> OTHER</h5>
                    </label>
                </div>
            </div>
            <div ng-if="result=='Other'" class="md-block" style="width: 600px">
                <span>Select the item that you are interested</span>
                <sn-record-picker id="item1" 
                                  field="location" 
                                  table="'u_sc_cat_item_ext'" 
                                  display-fields="'name,sc_catalogs'" 
                                  value-field="'sys_id'" 
                                  search-fields="'name'" 
                                  default-query="data.queryString">
                </sn-record-picker>
            </div>
            <br>
            <br>
            <button type="button" 
                    class="btn btn-primary btn-lg" 
                    id="proceed1"
                    ng-click="RequestService()">Proceed</button>
        </body>
    </div>
</div>

Контроллер: 

function ($scope, 
          $element, 
          $window, 
          $location,
          $rootScope, 
          $timeout, 
          snAttachmentHandler, 
          $http, 
          spUtil, 
          userPreferences, 
          $filter, 
          i18n, 
          $uibModal) {
    /* widget controller */
    var c = this;
    $scope.RequestService = function() {    
        $scope.data.action = $scope.item;-->>getting undefined value
        c.data.item1 = $('#item1').select2('val');
        $scope.server.update().then(function() {
            $scope.data.action = undefined;
            $scope.data.message = "";
            if ($scope.result == undefined) {
                $window.alert("RadioButton not checked.");
                //window.location.href='?id=hhs_request_page';
            }
            else {
                window.location.href = $scope.data.href;
            }
        });
    };
}

Ответы [ 2 ]

0 голосов
/ 29 июня 2019

Поскольку используется $parent, вы можете избавиться от проблем с новыми областями, созданными ng-if и ng-repeat, используя метод для обновления соответствующей переменной, пожалуйста, проверьте мой пример ниже и дайте мне знать, если это исправляет Ваша проблема! 

var app = angular.module('myApp', []);

app.controller('MyController', function MyController($scope) {
  $scope.selected = '';
  $scope.data = {
    items: [{
        'name': 'test',
        'sys_id': 1,
      },
      {
        'name': 'test2',
        'sys_id': 2,
      }

    ]
  }
  $scope.update = function(val) {
    $scope.selected = val;
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-controller='MyController' ng-app="myApp">
  <div>
    <!-- your widget template -->
    <div class="panel panel-default">
      <div class="panel-heading">
        <h3 class="panel-title" align="center">
          Select the options below to make a request:
        </h3>
      </div>

      <body>
        <div class="btn-group btn-group-justified">
          <div ng-repeat="item in data.items">
            <input type="radio" name="item" ng-checked="$first" id="{{::item.name}}" ng-click="update(item.sys_id)">
            <label class="form-check-label" align="center">
                        <h5> {{::item.name}}</h5>
                    </label>
          </div>
          <div>
            <input type="radio" name="select-service" ng-model="result" id="service3" ng-value="'Other'">
            <label class="form-check-label" align="center">
                        <h5> OTHER</h5>
                    </label>
          </div>
        </div>
        <div ng-if="result=='Other'" class="md-block" style="width: 600px">
          <span>Select the item that you are interested</span>
          <sn-record-picker id="item1" field="location" table="'u_sc_cat_item_ext'" display-fields="'name,sc_catalogs'" value-field="'sys_id'" search-fields="'name'" default-query="data.queryString">
          </sn-record-picker>
        </div>
        <br>
        <br>
        <button type="button" class="btn btn-primary btn-lg" id="proceed1" ng-click="RequestService()">Proceed</button>
      </body>
    </div>
  </div>
  {{data.items}}<br> {{selected}}
</div>
0 голосов
/ 28 июня 2019

Я думаю, что эта строка data-ng-model="$parent.item" Вы получаете доступ к родительскому элементу (может быть неопределенным).

Пожалуйста, перепроверьте.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...