проблема с разрешением ng-view, родительский контроллер, настраиваемая директива

Я так растерялся в своей ситуации. Позвольте мне кратко представить свою ситуацию.проблема с разрешением ng-view, родительский контроллер, настраиваемая директива

HTML-структура. (Это просто структура, полный HTML больше, чем это, но нет какой-либо другой контроллер, кроме «PageController»)

<body ng-app="app"> 
    <div id="wrapper" ng-controller="pageController"> 
     <div id="menu"> 
      <a>.........</a> 
     </div> 
     <div id="mainView"> 
      <ng-view></ng-view> 
     </div> 
    </div> 
</body>

Конечно, я правильно настроить маршрутизатор.

var app = angular.module("app", ["ngRoute"]) 
          .config(function($routeProvider){ 
           $routeProvider 
            .when("/about", { 
             templateUrl: "about.html" 
            }) 
            .when("/summary", { 
             templateUrl: "summary.html" 
            }) 
            .when("/company", { 
             templateUrl: "company.html" 
            }) 
            .when("/remote", { 
             templateUrl: "remote.html" 
            }) 
            .when("/personal", { 
             templateUrl: "personal.html" 
            }) 
            .when("/academic", { 
             templateUrl: "academic.html" 
            }) 
            .otherwise({ 
             redirectTo : "/about" 
            }); 
          });

Я не устанавливал контроллер сейчас. Я поместил каждый контроллер в качестве «pageController» до этого, но теперь я удалился, потому что я думаю, что pageController будет автоматически унаследован до тех пор, пока pageController находится в родительском элементе.

И я сделал специальную директиву.

app.directive('imageLoader', function(){ 
    return{ 
     restrict:'A', 
     link:function(scope, elem, attrs){ 
      elem.bind('click', function(){ 
       var fileName = "img/portfolioImages/" + attrs.ori; 
       scope.$parent.$parent.modalImgSrc = fileName; 
       scope.$parent.$parent.isModalOpen = true; 

       scope.$parent.$parent.$digest(); 
      }); 
     } 
    }; 
});

В нагнетаемой HTML в нг-зрения, не существует какой-либо другой контроллер, но это динамически генерировать <img> тег, как показано ниже

<div class="project-image-div"> 
    <img image-loader ng-repeat="aImgSrc in remoteImageFiles[0]" 
     data-ori='{{aImgSrc}}' class='project-img-s' 
     ng-src='img/portfolioImages/{{aImgSrc.substring(0,aImgSrc.lastIndexOf(".")) + "_s" + aImgSrc.substr(aImgSrc.lastIndexOf("."), 4)}}'> 
</div>

remoteImageFiles [0] JSON объект сохраняется в объеме PageController. И эти динамически добавленные теги img полностью прекрасны.

ПРОБЛЕМА

Как вы можете видеть в <img> теге, я использую пользовательские директивы образ-загрузчик. В директивном коде я ожидал, что «scope» будет такой же областью, что и pageController, если нет никакого другого контроллера внутри ng-view, и я не дал никакой опции для области действия в пользовательской директиве.

Но я напечатал объект области в консоли, я могу получить доступ к объекту scopeController scope как родительский элемент родителя ... ПОЧЕМУ ?????

scope.$parent.$parent.modalImgSrc = fileName; 
scope.$parent.$parent.isModalOpen = true; 

scope.$parent.$parent.$digest();

Спасибо за чтение моего длинный пост ... Пожалуйста, помогите ... Я провожу 2 дня для этого ..

Вы можете увидеть полный код в моем личном веб-сайте. Я noob к angularJS. Я конвертирую версию JQuery сайта в чистую версию angularJS, чтобы изучить AngularJS .. Это происходит.

AngularJS версия .. (преобразование в настоящее время) http://bear-mj.com/MJKim

JQuery версия .. (все работает) http://bear-mj.com/MJKimJQuery/

источник

2016-08-07 Myeong-jae Kim

У вас есть 3 уровня объема созданных. Помните, что и ng-repeat, и ng-view создать новую область. В этой области вашего приложения - внутри директивы:

scope является ng-repeat сфера
scope.$parent является ng-view сфера
scope.$parent.$parent является pageController сфера

источник

2016-08-07 05:15:42 Lex

Большое вам спасибо за ваш ответ ,Я предполагаю, что сначала я должен изучить основные угловые знания. Что более сложное в моем случае тогда. Доступ к родительскому элементу родителя кажется таким грязным. –

Моя рекомендация - использовать область изоляции этой директивы и передать свойства родительской области что вас интересует. Похоже, вы просто хотите установить пару значений на 'pageController', чтобы просто определить те, которые находятся в области изоляции, и передать их в директиву. – Lex

проблема с разрешением ng-view, родительский контроллер, настраиваемая директива

ответ

Смежные вопросы