[英]why the js I import in my component dosen't work?
I have Jquery function in mt angular navbar, those function doesn't seems to work once I route link to another component but those function are important for my navbar to be used, so I put them in a js file that I added to my angular.json script field so it can be loaded even when I route to a another componenet, but now I don't know why when I try to use my function containing my jquery code it doesn't work. I have Jquery function in mt angular navbar, those function doesn't seems to work once I route link to another component but those function are important for my navbar to be used, so I put them in a js file that I added to my angular .json 脚本字段,因此即使我路由到另一个组件也可以加载它,但现在我不知道为什么当我尝试使用包含我的 ZD223E1439188E4783249D5247EZ 代码的 function 时它不起作用。
navabr.component.ts navabr.component.ts
import {Component, OnInit} from '@angular/core';
import {AuthService} from "../auth.service";
import {clientType} from "../clientType";
import {navbarutil} from './navbarUtilities.js';
declare var $;
@Component({
selector: 'app-navbar',
templateUrl: './navbar.component.html',
styleUrls: ['./navbar.component.css'],
})
export class NavbarComponent implements OnInit {
constructor() {
}
ngOnInit(): void {
navbarutil.switchstate(); //launch with a collapsed navbar
navbarutil.unwindOnCollapsed();
navbarutil.buttonSwitch();
}
}
navabrUtilities.js navabrUtilities.js
function unwindOnCollapsed() {
$(document).ready(function() {
$('a.collapsed').click(() => {
console.log('hey '+this.isOpen());
if (!(this.isOpen())) {
this.switchstate()
}
});
});
}
function buttonSwitch() {
$(document).ready(function() {
$('#bouttonmenunavbar').click(() => {
this.switchstate();
});
});
}
function switchstate() {
$(document).ready(function() {
console.log('yes');
$('.sidebar').toggleClass('fliph');
$('.innerlist').collapse('hide');
});
}
function isOpen() {
return $('.sidebar').hasClass('fliph');
}
angular.json angular.json
"scripts": [
"./src/app/navbar/navbarUtilities.js"
]
could you help me find how to make them work?你能帮我找到如何让它们工作吗?
function buttonSwitch() {
$(document).ready(function() {
$('#bouttonmenunavbar').click(() => {
this.switchstate();
});
});
}
Ths problem might be here this.switchState()
.这个问题可能在这里
this.switchState()
。 The context of this
is the function of document. this
上下文是文档的 function。 You have to write an arrow function in order to get the this of your class which contains the method switchState
.您必须编写一个箭头 function 才能获得包含方法
switchState
的 class 的 this 。
function buttonSwitch() {
$(document).ready(() => { // here is the modification
$('#bouttonmenunavbar').click(() => {
this.switchstate();
});
});
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.