AngularJS =?绑定不更新

Question

我无法理解为什么我无法传递指令更新。

我试图用以下代码完成的是能够通过按下按钮来设置焦点。然而，问题是 drInput 上的 "focus" 绑定仅在指令加载时设置，而当它在 drWrap 中更改时它应该更改。为什么会这样？我该如何解决？

现在，女士们先生们，我向你们展示：密码！

<div ng-app="myApp">
  <dr-wrap></dr-wrap>
</div>

var myApp = angular.module('myApp', []);

myApp.directive('drWrap', function($timeout) {
        return {
            scope: {
                focus: '=?bind'
            },
            restrict: 'E',
            replace: 'true',
            template: '<div><button ng-click="openSearch()">focus</button><dr-input focus="focusSearch" /></div>',
            link: function(scope, elem, attr){
                                    scope.openSearch = function(){
                    $timeout(function(){
                        scope.focusSearch = true
                        alert('scope.focusSearch 2 = ' + scope.focusSearch)
                    }, 1000)
                }
            }
        };
    })
        .directive('drInput', function() {
        return {
            scope: {
                focus: '=?bind'
            },
            restrict: 'E',
            replace: 'true',
            template: '<input type="test" focus-me="{{ focus }}" />',
            link: function(scope, elem, attr){
                scope.$watch('focus', function(value){
                        if(value != undefined){
                        scope.focus = value
                        alert('scope.focus = ' + scope.focus)
                    }
                })
            }
        };
    })
    .directive('focusMe', ['$timeout', function ($timeout) {
        return {
            link: function (scope, element, attrs) {
                attrs.$observe('focusMe', function(value){
                    if ((value === true) || (value == 'true')) {
                        $timeout(function () {
                            element[0].focus()
                            scroll(element[0])
                        })
                    } else {
                        element[0].blur()
                    }
                    })
            }
        }
    }])

还有FIDDLE！ https://jsfiddle.net/L56rdqLp/168/

Answer 1

当你写scope: { focus: '=?bind' }时，这意味着属性名称应该是bind而不是focus，所以drWrap的模板应该是这样的：

template: '<div><button ng-click="openSearch()">focus</button><dr-input bind="focusSearch" /></div>'

将 ngBlur 事件处理程序添加到 drInput 指令 input 例如：

template: '<input type="test" focus-me="{{ focus }}" ng-blur="focus = false"/>',

当输入失去焦点时，将模型更改为 false。

这里是working fiddle.

AngularJS =?绑定不更新

AngularJS =?bind not updating

javascript

angularjs

angularjs-directive