ng-модель для поля выбора, не отражающего обратно в функции ссылки в директиве - PullRequest
Новая
       6

ng-модель для поля выбора, не отражающего обратно в функции ссылки в директиве

0 голосов
/ 24 сентября 2018

У меня есть элемент select в файле шаблона директивы.Если я выберу любое другое значение, оно не отражается в функции ссылки директивы.Но он отображается в файле представления при печати. ​​

Далее я показываю фрагмент кода для удобства чтения:

product.tpl.html 

<form ng-submit="update_product()" role="form" enctype="multipart/form-data">
  <select  name="product" ng-model="product" 
    ng-options="product.name for product in products track by product._id">
    <option ng-hide="true"></option>
  </select>
  <button type="submit" ng-hide="tab.active == 2">Update</button>
</form>

директива 

angular
  .module('app')
  .directive('product', product);

product.$inject = ['productService'];

function product(productService) {
  return {
    restrict: 'E',
    scope: {},
    link: link,
    templateUrl: 'product.tpl.html',
  };

  function link(scope, elem, attrs) {
    scope.product = {};

    scope.update_product = update_product;

    productService.get_products().then(
      function (response) {
        scope.products = response;
      },
      function (error) {
        console.log(error);
      }
    );

    function update_product() {
      console.log(scope.product); // prints undefined
    }

  }
}

данные о продуктах 

{
  "products":[
    {
      "_id":"LINUX_VM",
      "name":"LINUX OPERATING SYSTEMS",
      "supported_features":[
        "File System",
        "Linux Kernel",
        "SCSI Devices",
        "Security"
      ],
      "models":[
        {
          "id":"UBUNTU_DESKTOP",
          "name":"Ubuntu Desktop OS"
        },
        {
          "id":"UBUNTU_SERVER",
          "name":"Ubuntu Server OS"
        }
      ]
    }
  ]
}

1 Ответ

0 голосов
/ 24 сентября 2018

Вам нужно ng-change на вашем select. 

<form ng-submit="submit_product()" role="form" enctype="multipart/form-data">
  <select  name="product" ng-model="product" 
    ng-options="product.name for product in products track by product._id"
    ng-change="update_product()">
    <option ng-hide="true"></option>
  </select>
  <button type="submit" ng-hide="tab.active == 2">Update</button>
</form>

Обратите внимание, что я изменил ваш ng-submit на другую функцию, вы можете сохранить его, как если бы, но я предполагаюВы хотите использовать кнопку для отправки (и выполнить другую логику).

Кроме того, вам это не нужно: scope.update_product = update_product;

Просто сделайте это: 

scope.update_product = function () {
  console.log(scope.product); // prints undefined
}

Если это не отвечает на ваш вопрос, то вы должны предоставить punkr, как упомянуто Панкаджем Паркаром.

...