我正在尝试为jQuery UI开发一个抽象层,它允许将Widgets定义为与ExtJS类似(或类似)的对象.这是概念:
var mydialog = new $.ui.dialog({
modal:true,
renderTo:'body',
title:'The Windows Tittle',
content:'The content of the Window'
});
Run Code Online (Sandbox Code Playgroud)
现在我可以说:
mydialog.show();
Run Code Online (Sandbox Code Playgroud)
第一步(我认为)是为jQuery添加一个类创建函数,这允许创建类:
$.MYNAMESPACE.dialog = $.Class ({
constructor:function(){}
//methods and properties
});
Run Code Online (Sandbox Code Playgroud)
这里出现了真正的问题:我必须在上一个类定义中将真正的$ .ui.dialog与我的链接联系起来?我的意思是我不想创建一个新的小部件,我只想重用预定义的jQuery UI小部件后面的代码,以创建一个允许带有jQuery UI的OOP的抽象层.
提前致谢
我正在研究一个用javascript创建类的实用程序.它的工作原理,问题是如何定义私有属性.
这是代码
var OO = {
Class:function(){
var len = arguments.length;
var data = arguments[len-1];
var Klass;
if (data.constructor === Object){
Klass = function (){};
} else {
Klass = data.constructor;
delete data.constructor;
}
OO.extend(Klass.prototype,data); //Classic Extend Method
return Klass;
},
//Simple extend method, just what I need in this case
extend: function(target, source){
var prop;
for (prop in source)
target[prop] = source [prop];
}
}
Run Code Online (Sandbox Code Playgroud)
这是它的工作原理
// first create a class
var person = OO.Class ({
constructor: function (name, …
Run Code Online (Sandbox Code Playgroud) 有人可以告诉如何"解除绑定"匿名功能吗?JQUERY它能够做到这一点,但我怎么能在我自己的脚本中实现这个功能.
这是场景:
下面的代码将'onclick'事件附加到Div上,其中'someDivId'作为ID,现在你点击DIV,它显示'点击!'.
var a = document.getElementById('someDivId');
bindEvent(a,'click',function(){alert('clicked!');});
Run Code Online (Sandbox Code Playgroud)
这一切都很棒,问题是如果函数是匿名的,如何将函数"取消附加"到DIV,或者如何将所有附加事件"取消附加"到'a'元素?
unBind(a,'click'); //Not necessarily the given params, it's just an example.
Run Code Online (Sandbox Code Playgroud)
这是bindEvent方法的代码:
function bindEvent (el,evtType,fn){
if ( el.attachEvent ) {
el['e'+evtType+fn] = fn;
el[evtType+fn] = function(){
fn.call(el,window.event);
}
el.attachEvent( 'on'+evtType, el[evtType+fn] );
} else {
el.addEventListener( evtType, fn, false );
}
}
Run Code Online (Sandbox Code Playgroud) 我正在寻找一种方法来推断组件的 @Inputs 的正确类型。到目前为止,我只能@Input
使用以下命令来定位属性:
// Method in a service
setComponentInputs<T> (props: { [key in keyof T]?: any }) {
console.log(props);
}
Run Code Online (Sandbox Code Playgroud)
但正如您所看到的,类型仍然是any
另外,当前的方法允许针对组件内的所有内容,包括方法(例如 OnInit),但我不太确定是否有一个技巧可以仅针对 @Inputs。
让我为您提供更多背景信息,这是一个标准的 Angular 组件:
@Component({
selector: '',
templateUrl: './foo.component.html',
styleUrls: ['./foo.component.scss']
})
export class FooComponent implements OnInit {
@Input() myProp: string;
@Input() otherProp: CustomProp;
constructor() {}
ngOnInit() {
}
}
Run Code Online (Sandbox Code Playgroud)
这个想法是setComponentInputs(props)
在限制 props 参数以匹配组件@Inputs
属性的同时进行调用
// this one should compile
myService.setComponentInputs<FooComponent>({myProp: 'Hello there!'});
// this one should raise an error (because the …
Run Code Online (Sandbox Code Playgroud) 这个问题似乎遍布 GitHub 的 NX 存储库,但是我在那里找不到任何有效的解决方案。
\n我的工作区包含两个可构建的库:ui/avatar
和ui/icon
一个可发布的库,称为bar
我的想法是使用ui/avatar
和ui/icon
作为内部 monorepo 库(例如,这些库可以直接导入到应用程序中),但我也想将这 2 个可构建的库封装到npm 包中bar
并作为 npm 包发布bar
,以便外部消费者可以从中受益。
以下是文件结构的总体概述:
\nlibs\n \xe2\x94\xa3 external\n \xe2\x94\x83 \xe2\x94\x97 bar\n \xe2\x94\x83 \xe2\x94\x83 \xe2\x94\xa3 src\n \xe2\x94\x83 \xe2\x94\x83 \xe2\x94\x83 \xe2\x94\xa3 lib\n \xe2\x94\x83 \xe2\x94\x83 \xe2\x94\x83 \xe2\x94\x83 \xe2\x94\x97 external-bar.module.ts\n \xe2\x94\x83 \xe2\x94\x83 \xe2\x94\xa3 ng-package.json\n \xe2\x94\x83 \xe2\x94\x83 \xe2\x94\xa3 package.json\n \xe2\x94\x83 \xe2\x94\x83 \xe2\x94\xa3 project.json\n \xe2\x94\x83 \xe2\x94\x83 \xe2\x94\xa3 tsconfig.json\n \xe2\x94\xa3 ui\n \xe2\x94\x83 \xe2\x94\xa3 avatar\n \xe2\x94\x83 \xe2\x94\x83 …
Run Code Online (Sandbox Code Playgroud) 我正在尝试jsonwebtokens
在我的 Angular 项目中实现,为此我使用了一个HttpInterceptors
. 不幸的是,我面临以下错误:
this.interceptor.intercept 不是函数
我已经搜索了其他 Stackoverflow 线程以应用他们的解决方案,但到目前为止我无法使其工作。
这是我的 TokenInterceptorService
import { Injectable } from '@angular/core';
import { HttpInterceptor } from '@angular/common/http';
@Injectable({
providedIn: 'root'
})
export class TokenInterceptorService implements HttpInterceptor {
constructor() { }
intercept(req, next) {
let tokenizedReq = req.clone({
setHeaders: {
Authorization: 'Bearer xx.yy.zz'
}
});
return next.handle(tokenizedReq)
}
}
Run Code Online (Sandbox Code Playgroud)
这是我的 app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import …
Run Code Online (Sandbox Code Playgroud) angular ×3
javascript ×3
jquery ×2
typescript ×2
abstraction ×1
class ×1
http ×1
jquery-ui ×1
npm ×1
nrwl-nx ×1
oop ×1
tsconfig ×1