Angularjsディレクティブセットスコープ内のvarディレクティブとコントローラ内のアクセス

Question

こんにちは私はangularjsに取り組んでいます。私は指示の問題に直面しています。
リンク/クリックイベント にscope.user.name="amin shah"を設定しましたが、これをコントローラでアクセスしたいのですが、これはどのように可能ですか？

var dataSourceDirective = angular.module('mydirective', []); 
dataSourceDirective.directive('dir', function() { 
    return { 
     restrict: 'C', 
     scope: true, 
     link: function ($scope, element, attrs) { 
      element.bind('click', function() { 
        $scope.user.name ="amin shah"; 
        $scope.$apply(); 
        $('.sourceType_panel').hide(); 
        $('#sourceType_1_panel').show(); 

      }); 
     } 
    } 
}); 

コントローラコード

$scope.demo = function() { 
     console.log($scope.user);` 
}, 

Answer 1

はあなたのディレクティブで分離されたスコープを作成する必要があります。 与えられたコントローラはこの指令の親でなければなりません。 HTMLで

var dataSourceDirective = angular.module('mydirective', []); 
dataSourceDirective.directive('dir', function() { 
    return { 
     restrict: 'C', 
     scope: {user:"=user"}, 
     link: function ($scope, element, attrs) { 
      element.bind('click', function() { 
        $scope.user.name ="amin shah"; 

      }); 
     } 
    } 
}); 

：

<div ng-copntroller='yourCtrl'> 
<dir user="user"></dir> 
</div> 

コントローラでは、userを初期化する必要があります。

OR

親がコントローラである場合は、$broadcast & $emitを使用しています。

あなたは $rootScope.$emit('user_name_update',user);

を使用することができますし、コントローラにこのイベントを聞くことができますディレクティブの

Withingリンク機能のすべての

$scope.$on('user_name_update',function(data){ 

    console.log(user) // its should give your updated `user` object 
}) 

Answer 2

まず、あなたはあなたのリンクの方法を修正しなければならないと私はあなたが必要とするべきではないと思います子供はそこで騒ぎます。したがって、指示文でスコープバインドも削除する必要があります。あなたはリンクメソッドで親スコープに到達することができます。

app.directive('dir', function() { 
    return { 
     restrict: 'E', 
     link: function (scope, element, attrs) { 
      element.bind('click', function() { 
        scope.user.name ="amin shah"; 
        scope.$apply(); 

      }); 
     } 
    } 
}); 

とあなたのコントローラにあなたがそのようなスコープの変数を定義することができます。

app.controller('MainCtrl', function($scope) { 

     $scope.user = { 
     name: '' 
    } 
    }); 

また、あなたがHTMLにこのディレクティブを追加する必要があります。ここに

<dir>Element</dir> 
<p>{{user.name}}</p> 

は、あなたがクリックしなければならない作業plunkrです要素あなたの指示に由来するが、親の範囲内にあなたの名前が表示されるよりも

https://plnkr.co/edit/umTdfukZ22hARoLjxdL3?p=preview