类似的指令表现不同

Question

这两个指令都在同一个模块中。 第一条指令：

.directive('welcomeAndLog', function() {
        return {
            restrict: 'A',
            template: "<div ng-show=\"currentUser.get('username')\">Welcome {{welcome}}  <span ng-click=\"logOut(user)\">Logout</span> <br /></div>" +
                "<div ng-show=\"!currentUser.get('username')\"><span ng-click=\"fbLogIn()\"> FB LOGIN</span></div>"

        };
    })

这个工作正常：fbLogIn（）正确触发登录过程。 另一个指令，仍在同一个模块中：

.directive("unloggedWarning", function (mainListFactory) {
        return {
            restrict: "A",
            template: '<div ng-show="notLogged == 1">You are not logged in</div>' +
                '<div id="unLogged" ng-show="notLogged == 2">Not logged in and no data. <span ng-click=\"fbLogIn()\"> FB LOGIN</span></div>',
            link: function (scope) {
                scope.$watch('currentUser', function() {
                    if(scope.currentUser === null && mainListFactory.cachedData) {
                        scope.notLogged = 1;
                    } else if (scope.currentUser === null && !mainListFactory.cachedData) {
                        scope.notLogged = 2;
                    } else
                        scope.notLogged = false;
                });
            }
        };
    })

在第二个指令中，应该触发fbLogIn（）的单击不会发生任何事情。它似乎完全被忽视了。 为什么在第一个类似的情况下，我可以从跨度点击触发fbLogIn（），但不是在第二种情况下？

Answer 1

你的范围是问题。

第二个指令在范围上没有fbLogin()。如果将此函数传递给指令，或更改指令范围，它将起作用。