ngAfterViewInit(){
if (this.userFunctionJS){
this.loadScript(this.userFunctionJS);
}else{
console.log("userFunctionJS=" + this.userFunctionJS);
loadScript(scriptUrl: string) {
return new Promise((resolve, reject) => {
console.log("loadScript:" + scriptUrl);
const scriptElement = document.createElement('script')
scriptElement.src = scriptUrl
scriptElement.onload = resolve
document.body.appendChild(scriptElement)
其他方法https://blog.csdn.net/weixin_43622131/article/details/114684724
本文主要介绍的是关于Angular 2父子组件之间数据传递之局部变量获取子组件其他成员的相关内容,话不多说,来看看详细介绍:
通过@Input和@Output可以实现数据之间的传递,但是无法获取子组件的类属性和类方法,接下来我们通过局部变量方式实现获取子组件其他成员
第一步:定义子组件:
ChildenComponent.ts
(1).子组件中之定义了一个fun1()方法,提供给父组件调用
第二步:定义父组件
ParentComponent.ts
ParentComponent.html
通过#号来标识一个变量, 这样在父组件模板中创建了一个局部变量#chiden来获取子组
声明了一个名做BubbleChart的js function
然后在angular.json文件的architect/build/scripts json项中插入js脚本位置
注意上方图片VSCODE提示的路径,不要放错了地方,因为这个文件下有两个scripts
然后就是重新启动Angular项目,否则检测不到更改
接下来就是引用了,具体分两种
一是引用不带参数的函数
直接在要使用该function的ts文件中输入
angular在ts中引入js文件一、在全局引用js文件二、在局部引用js文件1.将引入的js文件封装成函数2.配置angular.json3.在相应的ts中声明4.调用js文件中的函数
一、在全局引用js文件
在angular项目的index.html中直接引用即可,这里引用的js是整个项目全局都可以使用的,但只有在index.html中才能引用,在其他的html页面直接引用js是不行的
二、在局部引用js文件
1.将引入的js文件封装成函数
这是一个使用echarts构造树图的js文件,因为在ts文件
AngularJS组件化:将页面中可以重复使用的标签封装成一个组件,方便这一部分UI重复使用,类似于JS中的函数,封装了一部分处理代码,通过函数调用就可以重复使用这些代码。
组件可以用.component 注册(在 angular.module 创建的module)。这个方法有两个参数:组件名称,组件配置对象(和指令的区别,一个是工厂方法,一个是对象)。
这是一个组件化的小应用:<!DOCTY
在Angular中我们或许会用到部分外部插件的时候,像Bootstrap,Jquery这些当然我们可以通过Npm安装包的形式引入,但是还有一些其它的js库需要引入的话,我们又应该怎样操作呢?
在这里做一个简单的介绍,便于记录↓
1、将自己下载好的js包文件放入项目指定文件夹中
2、然后在Angular.json中引入相关js文件
3、然后我们需要在typings.d.t...
代码推送到gitlab上之后,现在我们就需要编写项目的ci文件,这样gitlab才能执行CI流程。
将项目关联到Runner
因为Runner可能有多个,项目也可能有多个,那到底哪个项目应该执行哪些Runner,这里需要指定下。当然,这也看你安装Runner的Runner的类型。
具体可以看这里的文档说明
docs.gitlab.com/ce/ci/runne…
看下我安装的gitlab-runn...
2. 在 TypeScript 文件中获取 element 组件并添加描点:
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-my-component',
templateUrl: './my-component.component.html',
styleUrls: ['./my-component.component.css']
export class MyComponentComponent implements OnInit {
constructor() { }
ngOnInit(): void {
const myElement = document.getElementById('my-element');
const myAnchor = document.createElement('a');
myAnchor.setAttribute('name', 'my-anchor');
myElement.appendChild(myAnchor);
这样就可以在 element 组件中添加一个名为 "my-anchor" 的描点了。