Директива Scope in Custom не отслеживает изменение области действия контроллера. - PullRequest
0 голосов
/ 06 февраля 2020

Что я хочу: --- я хочу отключить несколько ссылок, присутствующих на странице входа, до тех пор, пока не будет введен правильный пароль Я могу заставить их спрятаться, но так как я учусь, я хочу узнать, как это можно сделать. Включение отключенных ссылок будет происходить по нажатию кнопки отправки.

Что я сделал: --- Я написал код и думаю, что он должен работать. Я использую пользовательскую директиву и событие link: bind. Я думаю, что проблема заключается в представлении (возможно), возможно, в ng-controller.

Что пошло не так: --- Таким образом, изменение области действия в контроллере не отражается в директиве. Из-за чего event.preventDefault () не запускается. Поэтому изначально директива scope принимает значение области видимости в контроллере. Если я установил значение $ scope.linkenabled = true в контроллере, как я это сделал прямо сейчас, тогда директива scope будет установлена ​​как true. Но когда я нажимаю кнопку входа в систему, хотя значение $ scope.linkedenable в контроллере меняется на false из-за $ scope.linkedenable = - $ scope.linkedenable.but, но это не отражается в области действия директивы, и это все еще верно.

Вот мой код: --- логин. js

trumodule.controller("trucontrollerlogin", ['$scope', '$location', '$timeout', function ($scope, $location, $timeout) {
    ***$scope.linkEnabled = true;***
    $scope.submit = function () {
        $scope.logimg = true;
        var username = $scope.username;
        var password = $scope.password;
        if (username == "674" && password == "Dakar") {
            $scope.status = "yes";
            $timeout(function () {
                $scope.logimg = true;
                $location.path('/KnowHow');
            }, 500);
            console.log($scope.linkEnabled);
            ***$scope.linkEnabled = !$scope.linkEnabled;***
            console.log($scope.linkEnabled);
        }
        else {
            $scope.status = "no";
            $timeout(function () {
                $scope.logimg = true;
            }, 500);
        }
    }

}])
***.directive('mylink', function () {
        return {
            scope: {
                enabled: '=mylink'
            },
            link: function (scope, element, attrs) {
                element.bind('click', function (event) {
                    console.log(scope.enabled);
                    if (scope.enabled) {
                        event.preventDefault();
                    }
                });
            }
        };
    });***

Index.cs html

<body ng-app="TruModule">
<td class="leftMenu width" ***ng-controller="trucontrollerlogin"***>
<a mylink = "linkEnabled" href="#!KnowHow"><img src="~/icons8-home-26 (2).png" /></a>
<a mylink = "linkEnabled" href="#!Employee"><img src="~/icons8-people-26.png" /></a>
<a mylink = "linkEnabled" href="#!Directives"><img src="~/icons8-book-shelf-26.png"/></a>
</td>

Пожалуйста, помогите мне с этой проблемой. Заранее спасибо

...