angular.js - When a controller's value changes, how to pass it to a directive in a timely manner?

Question

When I modify a variable in the controller controller, I hope that the instruction directive can obtain the modified value of the variable in time.

app.directive('popoverMobile',function(){
    return {
        restrict:"E",
        transclude:true,
        scope:true,
        templateUrl:"tmpl/popover.mobile.tmpl.html",
        controller:["$scope",function($scope){
            $scope.popover_status=false;
            jQuery.ajax({
                type:"GET",                
                url:"https://**.***.com/**.htm?tel="+$scope.parents_detail.mobile,
                dataType:"jsonp",
                jsonp:"callback",
                jsonpCallback:"jsonpCallback",
                success:function(data){
                    $scope.mobile_info=data;
                }
            });
        }],
        link:function(scope){
            scope.switch_popover=function(val){
                scope.popover_status=val;
                scope.$apply();
            }
        },
        replace:true
    }
});

$scope.parents_detail.mobile is a variable in the controller;
When the value of $scope.parents_detail.mobile changes, the interface is requested again.

Answer 1

$scope.$watch

Answer 2

AngularJS directives can share attributes defined in the parent scope by default. For example, objects and attributes in the parent scope can be used directly in templates. Usually some simple directive functions can be implemented using this direct sharing method. When you need to create a reusable directive that only occasionally needs to access or modify the data of the parent scope, you need to use an isolated scope.

AngularJS Directive isolates Scope data interaction