нг-модель не является двунаправленной конкретно в моем приложении

0

ОБНОВЛЕНИЕ: По-видимому, устанавливая контроллер в представлении, такой ng-controller="SomethingController as Ctrl" а затем его использование в модели ng-model="Ctrl.myModel" работает. Что такое f ***?

Я имел в виду реализовать эту конкретную директиву в своем приложении. Это просто требует, чтобы я поместил свою модель в качестве атрибута элемента как ng-model="myModel" и он должен работать. Я вижу примеры его работы, и я тоже работал над jsfiddle.

Однако он просто не хочет работать с моим приложением. Я установил через bower, я включил все файлы в свой index.html и я также ввел его angular.module('myApp', ['angular-input-stars']).

Теперь проблема заключается в том, что модель работает только в моем приложении. ng-model="myModel" использует значение myModel и устанавливает правильное количество звезд, но как только я меняю звезды (в директиве и через нее), это значение не возвращается обратно в мою модель.

Я проверил код директивы, и они используют контроллер модели, установив значение:

function link(scope, element, attrs, ngModelCtrl) {
    //...

    scope.setValue = function (index, e) {
         //...
        ngModelCtrl.$setViewValue(scope.last_value);
    }    
}

И хотя директива не включает в себя return этой scope: {ngModel: '='}, это все еще работает на примерах и jsFiddle, хотя я действительно не понимаю $setViewValue (даже после изучения этого).

Я думаю, что это может иметь какое-то отношение к моей архитектуре приложений, но я не уверен. Приложение очень надежное и хорошо структурированное, и я не могу отобразить его код (код компании), но могу сказать, как мы его структурировали:

|-- app.js (contains directive module, show bellow)
|-- index.html
|-- /modules
      |-- /something
            |-- /overview
                  |-- somethingController.js 
                      (included in index.html & loaded through directive)
                  |-- somethingDirective.js
                      (included in index.html & loaded through app.js module)
                  |-- somethingView.html
                      (loaded through directive)

Код приложения:

var app = angular.module('myApp', [
    'angular-input-stars',
    'something.overview'
]);

somethingDirective.js:

var somethingOverview = angular.module('something.overview');

somethingOverview.directive('somethingOverviewDirective', function () {
    return {
        restrict: 'E',
        controller: 'SomethingOverviewController',
        templateUrl:     'modules/something/overview/somethingOverviewView.html',
        scope: {
            overview: '=overview',
            errors: '=errors'
        }
    };
});

somethingController.js:

var somethingOverview = angular.module('something.overview', []);

somethingOverview.controller('SomethingOverviewController', 
    ['$scope', function ($scope) {
        function init() {
            $scope.myModel = 5;
        }

        // ...

        init();
    }]);

somethingView.html:

<div>
    Rating: {{myModel}}
    <input-stars max="5" ng-model="myModel"></input-stars>
</div>
  • 0
    Можете ли вы вставить ссылку на jsfiddle здесь?
  • 0
    Самое большое и единственное отличие, которое я вижу, заключается в том, что в jsfiddle я использую «myCtrl as Ctrl», а затем «Ctrl» для доступа к модели. Может ли это быть так? И если так, как я могу сделать это «как», когда представление загружается директивой? Здесь: jsfiddle.net/filipetedim/14f05jdb/1
Показать ещё 4 комментария
Теги:
angularjs-directive

1 ответ

2
Лучший ответ

Как упоминалось в комментариях @charlietfl, первостепенное значение в области видимости - это проблема

Код без контроллераА:

<div ng-app="myApp">
    <h3>Greetings</h3>
    <div ng-controller="MyCtrl">
        Hello, {{name}}!

        <div>Rating: {{rating}}</div>

        <input-stars ng-model="rating.value" max="5"></input-stars> 
    </div>
</div>


app.controller("MyCtrl", ['$scope', function($scope) {
    $scope.rating = {
        value: 5
    };
    $scope.name = 'Superhero';

}]);

Обновлен jsFiddle:

https://jsfiddle.net/14f05jdb/3/

  • 0
    Это правильный ответ. Я хотел бы дать реквизит @charlietfl, который объяснил мне до этого.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню