Как связать переменную event.time в родительской области из директивы с изолированной областью без использования $ parent в директиве? - PullRequest
Новая
       7

Как связать переменную event.time в родительской области из директивы с изолированной областью без использования $ parent в директиве?

0 голосов
/ 24 апреля 2018 

angular.module('hfp.calendar')
    .controller('printPreviewCntrl', ['$scope', 'htmlFromServer',
    	function($scope, htmlFromServer){

    	    $scope.htmlReceived = htmlFromServer;
            $scope.event = {};

}])
.directive('compile', function($compile, $timeout) {

    return {
	    restrict: 'A',
		link: function(scope, element, attrs) {
			$timeout(function() {
				element.html(scope.$eval(attrs.compile));
				$compile(element.contents())(scope);
			});
		}
	};

})
.directive('initModel', function($compile) {

	return {
		restrict: 'A',
		scope: {
			eventField: '=initModel'
		},
		link: function(scope, element, attrs) {
			scope.eventField = element[0].innerText;
			element.attr('ng-bind', '$parent.' + attrs.initModel); // why do i have to use $parent here to make it work ?
			element.removeAttr('init-model');
			$compile(element)(scope);
		}
	};

});
<!-- clientside html -->
<input type="text" ng-model="event.time">
<div compile="htmlReceived">

</div>

<!-- html coming from server -->
<div init-model="event.time">
	10:30 AM
</div>

Я хочу привязать к родительской области видимости var event.time из директивы initModel , но она работает только тогда, когда я использую $ parent для ссылкик переменной в родительской области видимости.Могу ли я добиться этой привязки без использования $ parent?

1 Ответ

0 голосов
/ 24 апреля 2018

Нет необходимости реализовывать эту директиву с изолированной областью действия. Просто воспользуйтесь услугой $parse: 

angular.module("app",[])
.directive('initModel', function($parse) {
    return {
        restrict: 'A',
        //scope: {
        //	eventField: '=initModel'
        //},
        link: function(scope, elem, attrs) {
            var setter = $parse(attrs.initModel).assign;
            setter(scope, elem.text().trim());
            scope.$watch(attrs.initModel, function(value) {
                elem.text(value);
            });
        }        
     };
})
<script src="//unpkg.com/angular/angular.js"></script>

<body ng-app="app" ng-init="event={}">
    <input type="text" ng-model="event.time">
    <div init-model="event.time">
	       10:30 AM
    </div>
</body>

Для получения дополнительной информации см. Справочник по API службы AngularJS $ parse .

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...