Угловая область доступа JS из-за пределов контроллера

Итак, я просто попытался сделать изменение с простого JS на угловое, и мне интересно, как я получаю доступ к области моего контроллера из другого .js-файла. Я огляделся, и я попробовал пару способов, но не повезло.Угловая область доступа JS из-за пределов контроллера

Я нашел подобные вопросы, такие, как показано ниже, такие как

AngularJS. How to call controller function from outside of controller component

AngularJS access scope from outside js function

Я не ищу, чтобы сделать какие-либо изменения в значение области, а просто использовать функцию из объем. Любые идеи о том, как я буду обращаться к функции из области контроллеров в другой .js-файл?

источник

2016-03-09 morrisstu

Вы можете назвать это так: Например HTML:

<div ng-app> 
<div id="outer" ng-controller="MsgCtrl"> 
    You are {{msg}} 
</div> 
<div onclick="change()">click me</div>

И JS:

function MsgCtrl($scope) 
{ 
    $scope.msg = "great"; 
} 

function change() 
{ 
    //alert("a"); 
    var scope = angular.element(document.getElementById('outer')).scope(); 
    console.log(scope); 
    //scope.msg = 'Superhero'; 
}

Как вы можете видеть, что вам нужно получить по ID, а не имя контроллера.

Fiddle

источник

2016-03-09 19:44:56 alexey

Эй, Алексей, я встретил это решение ранее этим вечером, но я все время получаю сообщение об ошибке, я отредактировал вопрос, чтобы дать дополнительную информацию. – morrisstu

Привет, посмотри, я отредактировал ответ. – alexey

Поместите идентификатор помечать, где вы применяете нг-контроллер, а затем получить объем будет столь же просто, как это:

<div ng-controller="MyController id="myScope"> 
</div> 
.. 
var myScope = angular.element(myScope); 
myScope.runSomeFn();

См fiddle

источник

2016-03-09 20:06:29

В другом файле JavaScript, например, имя файла. app.js? Мое понимание тега DIV заключается в том, что оно чисто внутри HTML. – morrisstu

Не имеет значения, куда поместить вызов в область видимости, если это в том же файле с div или в другом. [Здесь] (https://jsfiddle.net/nikishkinvv/wuucd8yd/) Я привел пример. –

Вам нужно впрыснуть $ контроллера чтобы создать экземпляр контроллера внутри любого другого Js (файл, который вы хотите расширить с помощью этой функции. В этом примере я буду использовать другой контроллер):

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

 
app.controller('fileCreateController',[function(){ 
 
    
 
    this.action = 'Initial value'; 
 
    
 
    this.fileCreate = function(value){ 
 
    
 
    console.log('ACTION'); 
 
    
 
    this.action = value; 
 
    
 
    } 
 
    
 
}]); 
 

 
app.controller('anyController', ['$controller', function($controller){ 
 
    this.valueToSend = 'Changed value from fileCreateController'; 
 
    angular.extend(this, $controller('fileCreateController')); 
 
    
 
    }]);

<!DOCTYPE html> 
 
<html ng-app="myApp"> 
 
    <head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
    </head> 
 
    <body ng-controller="anyController as vm"> 
 
    <button name="button" ng-click="vm.fileCreate(vm.valueToSend)">Click me</button> 
 
    <p>{{vm.action}}</p> 
 
    
 
    </body> 
 
</html>

Однако, если вы можете, вы должны создать службу с помощью функции вы хотите поделиться, и внедрить услугу везде, где вы хотите использовать эту функцию.

источник

2016-03-09 21:22:25 Germando

Я играл с ним с самого начала и задавался вопросом, можно ли сделать это в обратном направлении, то есть передать объект/переменную на контроллер? Трудная вещь с предложением связана с кордорой. Я не могу использовать _any_ HTML-элементы в определенных частях. – morrisstu

Конечно, вы можете отправить объект или любое другое значение в качестве параметра из функции в представлении. Что-то вроде этого: vm.fileCreate (OBJECT/VARIABLE); – Germando

Я обновил код. – Germando

Я бы просто установил его на $ rootScope, а не на некоторую ограниченную область контроллера (предполагая, что у нее есть глобальное приложение, которое кажется вашим звуком).Затем вы должны использовать $ rootScope как своего рода услуг или сделать услугу, чтобы сделать то, что вы хотите

В CoffeeScript (потому что я ленив как это)

app/app.module.coffee

angular.module 'myApp', []

app/app.run.coffee

angular.module 'myApp' 
    .run ['$rootScope', ($rootScope) -> 
    # Do your initialization here and perhaps set a flag on the rootScope 

    $rootScope.deviceReady = true # for example once you know it is ready  
    $rootScope.$broadcast("device:ready") 
    ]

app/some-useful.controller.coffee

angular.module 'myApp' 
    .controller SomeUsefulController, ['$scope', '$rootScope', ($scope, $rootScope) -> 
    $rootScope.$on('device:ready', -> 
     #do what you want knowing device is ready 
    ) 
    ]

Другой подход, если вам нужно было бы сделать это наоборот и испустить событие от контроллера, а слушатель будет глобальным в app.run. В этом случае вы просто транслируете, когда все готово в контроллере на $ rootScope, и пусть слушатели в глобальном пространстве приложения справятся с этим.

app/app.run.coffee

angular.module 'myApp' 
    .run ['$rootScope', ($rootScope) -> 
    $rootScope.$on("device:ready", -> 
     alert("Device is ready") 
    ) 
    ]

app/some-useful.controller.coffee

angular.module 'myApp' 
    .controller 'SomeUsefulController', ['$scope', '$rootScope', ($scope, $rootScope) -> 
    $scope.someFunction = -> 
     # do something useful as you like 
     $rootScope.$broadcast('device:ready') 
    ]

Я не знаю достаточно о вашем конкретном случае использования, чтобы дать вам прямой ответ, но это те принципы, которые я нашел, чтобы получить большее гибкость, а не использование наследования Prototypal controller, которое, как правило, делает ваше приложение все более и более хрупким с течением времени.

Конечным подходом было бы использовать директиву, которая инкапсулирует вашу логику, которую вы затем можете просто вставить в любую область контроля.

источник

2016-03-10 07:39:00

Вы также можете попробовать это.

<script> 
var myConEle = document.querySelector('[ng-controller=myController]'); 
var $scope = angular.element(myConEle).scope(); 
</script> 

<div ng-controller="myController"> 

</div>

источник

2017-08-24 12:53:24

Угловая область доступа JS из-за пределов контроллера

ответ

Смежные вопросы