在Angular外部使用js调用Angular控制器中提供的函数方法或变量

最新推荐文章于 2022-02-18 10:13:08 发布
最新推荐文章于 2022-02-18 10:13:08 发布
阅读量758 收藏
点赞数
分类专栏： angularjs 文章标签： angular控制器
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_37885651/article/details/90300355
版权

在Angular外部使用js调用Angular控制器中提供的函数方法或变量

				var appElement = document.querySelector('[ng-controller="controller_name"]');
                var $scope = angular.element(appElement).scope();
                $scope.projectId = "132132123123123";
                //赋值
                $scope.$apply();
                
                $scope.getAllUser();
                //可以调用controller的方法
前端小狮
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
angularjs controller之间的通信
03-10 3268
接触了angularjs有一段时间了，最近遇到一个问题，需要在controller之间进行通信，当初想了一下，并不是很难，angularjs不是有个rootscope吗， 于是我就在其中一个controller里面写了一个function，然后赋值给rootscope，然后在另一个controller里面进行直接调用rootscope的这个方法， 虽然可以实现基本的功能，但是 有一个很严重的问
Angular外部使用js调用Angular控制器中的函数方法或变量用法示例
11-28
本文实例讲述了Angular外部使用js调用Angular控制器中的函数方法或变量。分享给大家供大家参考，具体如下： <!DOCTYPE html> <html ng-app="myApp" id="myApp"> <head> <meta name="viewport" content="width=device-width" /> <title>Test</title> [removed][removed] </head> <body ng-controller="myCon
AngularJS外部函数动态调用实践
yhm_js的专栏
03-28 2355
AngularJS外部函数动态调用实践1.angular js 中$apply()的使用angular js的双向数据绑定，在开发中起到的作用灰常大，但是，并不是所有时候都能起作用。双向数据绑定其实也就是当模型发生了变化的时候，重绘了DOM，使你看到数据被更新了，引发模型变化的情况有：1,dom事件；2,xhr响应触发回调；3,浏览器的地址变化；4,计时器触发回调；以上的某一个情况发生，都会触发模...
angularjs controller ajax,怎么调用angularjs controller里面的方法
weixin_42299198的博客
08-06 228
实在是不能对jquery的ajax方法和基于页面dom的各种取值、传值方法满意(虽然jquery已经解救过我一次了)，刚好手上这个项目用jquery的方法写了一半，决定试试很久以前自学的angularJS，把现在项目中jquery得部分用angularJS重写一遍。写的时候碰到很多问题，因为刚开始用，写法思路还是和写jquery相似，导致与在一个生成select option下拉框时花费了2个小时...
angularjs作用域和函数调用
weixin_34279579的博客
11-15 134
<!DOCTYPE HTML> <html ng-app> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script src...
AngularJS中控制器函数的定义与使用方法示例
11-29
在JavaScript中，我们使用`angular.module()`方法来创建或获取一个模块。例如： ```javascript var app = angular.module("myApp", []); ``` 这里的`"myApp"`是模块的名称，空数组`[]`表示该模块没有依赖其他模块...
详解angular如何调用HTML字符串的方法
08-27
在Angular中，我们通常使用双大括号`{{ }}`来绑定数据到视图，例如显示产品详情`{{post.content}}`。这种方式适用于普通的文本数据，但当`post.content`包含HTML标签时，Angular会将其当作纯文本处理，导致HTML标签...
Angular使用Md5加密的解决方法
08-29
总的来说，Angular中使用MD5加密是一个相对简单的操作，主要通过引入合适的库并调用其提供的方法即可实现。然而，随着技术的发展，开发者应当关注并考虑采用更安全的加密算法来保护用户数据。同时，除了前端加密，...
angular js 各种功能函数介绍
我若 姓陈 的博客
07-29 5200
把angular js 的一些功能函数记录下来，就相当于做做笔记！！ 1.angualar.bind  ：将对象绑定进 函数中,    如： var obj = { name: "Any" }; var fn = function (Adj) {   console.log(this.name + "is a boy!!! And he is
angularjs之$controller的使用
youhebuke225的博客
02-18 897
例子 我们可以先运行一下这个例子，看看效果 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <script src="https://cdn.bootcdn.net/ajax/libs/angular.js/1.6.8/angular.min.js"></script> <script src="https://cdn.bootcdn.net
js调用angularjs的函数
yzk527498580的专栏
05-05 469
function test(txm){ //获得对象 var appElement = document.querySelector('[ng-controller=MainCtrl]'); //获得scope var $scope = angular.element(appElement).scope(
外部js调用angularjs中的方法及浏览器控制台获取元素调试以及angular.element()用法
u011323200的博客
04-12 2500
1、在浏览器中打开调试控制台 2、原理：在Control中，使用angular.element()可以返回一个jquery对象，如angular.element(document).ready(function(){}); 其中document是指使用js获取的html node， 如： var sidebar = document.getElementsById('sidebar'); var ...
ZH奶酪：JavaScript调用AngularJS的函数/$scope/变量
weixin_33694620的博客
05-19 215
使用背景： 需要在其他JavaScript文件中调用AngularJS内部方法或改变$scope变量，同时还要保持双向数据绑定； 首先获取AngularJS application： 方法一：通过controller来获取app var appElement = document.querySelector('[ng-controller=mainController]'); 然...
AngularJS——AngularJS中的Controller(控制器)
huangsy421的博客
02-15 244
先看个示例转载 &lt;!-- 在该控制器内保存着如下两个Model里的数据 ng-model 指令用于双向绑定输入域到控制器的属性 --&gt; 第一个数字: &lt;input type="text" ng-model="first"&gt;&lt;br&gt; 第二个数字: &lt;input type="text" ng-model="second"&g
神奇的angularJS --连接controller的桥梁 service
ft6302244的专栏
01-12 5229
一、什么是service 在以前的文章中，我们提到，controller是相对独立的，也就是说，两个controller之间，内存是不共享的，这个controller是无法访问其他其他controller的属性或者方法的。但是，实际项目中，页面1的controller是有可以需要页面2的controller的。以前，我都是通过localStorage来进行储存，后来发来localStorage应
angularJS指令--在各自的控制器里调用不同的函数
weixin_30607029的博客
07-27 104
我们自定义的指令可能用在不同的控制器中，在不同的控制器中指令执行的方法或一样，或不一样，对应的操作也不一样； 讲一下，自定义在不同的控制器怎么执行不同的函数； <!DOCTYPE html> <html> <head> <title>ng1</title> <script type="text/javascrip...
AngularJS 控制器
Radom&7
07-19 236
关于 controller 中作用域的问题： controller 中，如果局部 scope和scope和scope 和 rootScope 都存在，且有相同名字的变量，{{变量名}} 指局部变量而不是全局变量，作用域只有当前 controller；{{root.变量名}}&nbsp;是全局变量，在&nbsp;ng-app=""&nbsp;下任何一个&nbsp;controller&nbsp;中...
angular中如何实现监听变量数据的变化
最新发布
07-14
在 Angular 中，你可以使用 `ngOnChanges` 生命周期钩子或 `Observable` 来监听变量数据的变化。 1. 使用 `ngOnChanges` 生命周期钩子： - 在组件类中实现 `ngOnChanges` 方法，并接收一个 `SimpleChanges` 对象作为参数。 - 在 `ngOnChanges` 方法中，你可以通过访问 `SimpleChanges` 对象获取到变化前后的值，并执行相应的逻辑。 下面是一个示例： ```typescript import { Component, Input, OnChanges, SimpleChanges } from '@angular/core'; @Component({ selector: 'app-my-component', template: ` <p>Previous Value: {{ previousValue }}</p> <p>Current Value: {{ currentValue }}</p> ` }) export class MyComponent implements OnChanges { @Input() myVariable: any; previousValue: any; currentValue: any; ngOnChanges(changes: SimpleChanges) { if (changes.myVariable) { this.previousValue = changes.myVariable.previousValue; this.currentValue = changes.myVariable.currentValue; // 执行其他逻辑... } } } ``` 在上面的示例中，`myVariable` 是一个输入变量，当它的值发生变化时，`ngOnChanges` 方法会被调用，并且我们可以通过 `changes.myVariable` 获取到变化前后的值。 2. 使用 `Observable`： - 在组件中定义一个 `Subject` 或 `BehaviorSubject` 对象来作为可观察对象。 - 在需要监听数据变化的地方，订阅这个可观察对象，并在回调函数中执行相应的逻辑。 下面是一个示例： ```typescript import { Component } from '@angular/core'; import { Subject } from 'rxjs'; @Component({ selector: 'app-my-component', template: ` <p>Current Value: {{ currentValue }}</p> ` }) export class MyComponent { myVariable$ = new Subject<any>(); currentValue: any; constructor() { this.myVariable$.subscribe(value => { this.currentValue = value; // 执行其他逻辑... }); } updateValue(newValue: any) { this.myVariable$.next(newValue); } } ``` 在上面的示例中，`myVariable$` 是一个 `Subject` 对象，我们可以在其他地方调用 `updateValue` 方法来更新变量的值。当值发生变化时，订阅 `myVariable$` 的回调函数会被触发，我们可以在其中获取到最新的值并执行相应的逻辑。 这两种方法各有不同的应用场景，你可以根据实际需求选择合适的方式来监听变量数据的变化。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值