Директива AngularJS: значение из файла cookie не применяется к привязке данных

#javascript #angularjs #angularjs-directive

#javascript #angularjs #angularjs-директива

Вопрос:

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

 .directive('orgList', ['$rootScope', '$state', 'Auth', 'ipCookie', function ($rootScope, $state, Auth, ipCookie) {
    return {
        restrict: 'A',
        replace: true,
        template: '<div class="form-group"><div class="input-group">'  
            '<span class="input-group-addon"><b>My orgs</b></span>' 
             '<select class="form-control" ng-model="selectedOrg"' 
                  'ng-options="org.name for org in orgs"></select>' 
                '</div></div>',
        link: function(scope, elem, attrs) {
                scope.orgs = Auth.user.organizations;
                scope.selectedOrg = ipCookie('selectedOrg') || _.first(scope.orgs);

                scope.$watch('selectedOrg', function (value) {
                    if(!_(value).isEmpty()) {
                        ipCookie('selectedOrg', value);

                        var temp = { 
                            role: Auth.userRoles[value.role] || Auth.user.role 
                        }
                        _(Auth.user).extend(temp);
                        $rootScope.$broadcast('userRoleChanged', value.id);
                    }
                });

                scope.$on('userRoleChanged', function (event, id) {
                    if(!Auth.authorize(Auth.accessLevels.admin)) {
                        if($state.current.url.match('/organization/')) {
                            $state.go('private.profile');
                        }
                    } 
                });
            }
        }
    }
}])
  

Теперь я хочу заставить его запоминать выбор пользователя: когда пользователь выбирает организацию в выпадающем списке, после перезагрузки страницы я хочу, чтобы он видел ту же организацию из файла cookie.

В чем проблема:

 scope.selectedOrg = ipCookie('selectedOrg') || _.first(scope.orgs);
  

если файл cookie не определен и выбрана _.first(scope.orgs) часть, в выпадающем списке отображается организация, как и должно быть, но если я получаю значение из файла cookie, то в нем отображается пустой текст выпадающего списка. console.log() покажите, что selectedOrg является правильным в обоих случаях.

Ответ №1:

Наиболее вероятной причиной является идентификация объекта.

Это означает, что значение, полученное из ipCookie() сервиса, может иметь то же содержимое, что и значение из orgs списка (т. Е. Поля одинаковы, если сравнивать одно за другим), но сам объект отличается в a === b смысле Javascript. Как бы то ни было, Angular настроен на использование сравнения равенства JS.

Вы можете:

  1. Попробуйте добавить track by предложение:

     <select ... ng-options="org.name for org in orgs track by org.id">
      
  2. Если ipCookie('selectedOrg') возвращает значение, не помещайте его в scope.selectedOrg ; вместо этого найдите в своем orgs списке этот конкретный объект и поместите этот объект в scope.selectedOrg .

Комментарии:

1. Работает как шарм. Спасибо.