AngularJS, how to use the ng model inside a custom directive tag by setting the controller dynamically?

I recently started with Angular , so I have a few questions.

My problem:
I created a directive that I will use in many "pages" with different controllers in each situation, for example.
Now I can dynamically configure the controller, this problem is solved!
But in each instance the directive, I want to determine which variable is to be changed in the controller, for example ng-model. If I put directly in the tag in the template, it works, but I need it dynamically.

DIRECTIVE

app.directive('mySelectPicker', function () {
var ddo = {};
    ddo.restrict = 'E';
    ddo.templateUrl = 'js/directives/views/my-select-picker.html';

    ddo.scope = {};
    ddo.controller = "@";
    ddo.name = "controllerName";

    return ddo;
});

MY-SELECT-PICKER.HTML:
OBS1: (ng-repeat times) OBS2: ng-model select, , !

<select>
    <option value="{{time.value}}" ng-repeat="time in times" >{{time.text}}</option>
</select>

CONTROLLER

app.controller('MyController', function($scope, moment){
    $scope.times = []; //array with the options
    $scope.val1 = '';
    $scope.val2 = '';
});

:

<my-select-picker controller-name="MyController" **ng-model="val1"**></my-select-picker>
<my-select-picker controller-name="MyController" **ng-model="val2"**></my-select-picker>

ng-model <my-select-picker>, , . ?

+4
1

, , , .

ng-model , ues ng-model , . model list, model list . =, . ng-options ng-repeat , ng-options ng-model .

HTML

<my-select-picker list="times" controller-name="MyController" model="val1"></my-select-picker>
<my-select-picker list="times" controller-name="MyController" model="val2"></my-select-picker>

ddo.scope = {
   model: '=',
   list: '='
};

--picker.html

<select ng-model="model" ng-options="l.value as l.text for l in list"></select>
+1

Source: https://habr.com/ru/post/1619970/


All Articles