杂记1 - 简书

杂记1

1.绑定：
单向从数据源到视图->{{expression}}与[target]="expression"
从视图到数据源的单向绑定 -> (target)="statement"
双向->[(target)]="expression"
2.让输入的数字，有最大最小的限制和小数点位数的限制：
<input type="number" style="border: 0px; text-align:center; background:transparent; width:100%" [class.input-error]="data.bandwidth < 48 || data.bandwidth > 192"
[(ngModel)]="data.bandwidth" min="48" max="192" (keyup)="tb.changeDetector.detectChanges();checkError();"
(blur)="data.bandwidth = +data.bandwidth.toFixed(0);data.bandwidth = data.bandwidth < 48 ? 48 : (data.bandwidth > 192 ? 192 : data.bandwidth)">
3.使用name变量要小心。库里有此全局的，使用不小心的话，编辑器没法看出错误了，容易导致问题发生。
4.数据绑定到元素上，有一定的延迟性。因此，依赖于input的数据绑定来及时改变数据是不可行的。比如，在外部调用一个组件的set()方法，这个组件还有一个input的变量，可以通过外部数据绑定的传入。
假设在:改变绑定的变量，马上调用组件的set()方法。而在组件内部，set()方法需要调用input的变量，那么，此时，变量是不会被立即更新的，数据还是以前的数据。
5.事件订阅，默认是同步的。但是可以设置为异步的：
事件的接口如下：
export declare class EventEmitter<T> extends Subject<T> {
__isAsync: boolean;
/**
* Creates an instance of {@link EventEmitter}, which depending on isAsync,
* delivers events synchronously or asynchronously.
*
* @param isAsync By default, events are delivered synchronously (default value: false).
* Set to true for asynchronous event delivery.
*/
constructor(isAsync?: boolean);
emit(value?: T): void;
subscribe(generatorOrNext?: any, error?: any, complete?: any): any;
}

使用：const aEvent = new EventEmitter<string>(true);
构造方法里写了true，那么就是异步的了，否则就是同步的。
6.本地文件的读写,使用FileReader即可。
看这篇文章：https://www.cnblogs.com/hhhyaaon/p/5929492.html
自己的例子：
const rd = new FileReader();
rd.onload = async (r) => {
const buffer = <string>r.target['result'];
}
rd.onerror = (r) => {
this.msgBox.showError('GLOBAL.ULF');
};
rd.readAsText(this._fileInput.nativeElement.files[0]);
7.把visual studio code上面的菜单栏隐藏了，，请问如何把菜单栏找回来?
F1 or shift+ctrl+p 切换出命令行，然后输入menu 有个view:toggle Menu bar 的功能.
或者使用alt键显示或者隐藏menu的显示。
8.读取文件的实例：
if (type === RServerProfileType.D31OFDMTable) {

            rd.onload = async (r) => {
                const texts = <string>r.target['result'];
                this.editProfile.emit([rr, uplodaFileNames[0], texts]);
            }
            rd.readAsText(this._fileInput.nativeElement.files[0]);

        } else if (type === RServerProfileType.FPSweep) {

            rd.onload = async (r) => {
                const datas = new Uint8Array(<ArrayBuffer>r.target['result']);//这个地方为何如此转，有时间再查。
                this.editProfile.emit([rr, uplodaFileNames[0], datas]);
            }
            rd.readAsArrayBuffer(this._fileInput.nativeElement.files[0]);

        }

9.延迟通知，比如在过滤数据的时候，用户在输入过程中不用立即显示，等用户输入完后在再进行搜索。那么需要使用到延迟了。方法是：

private _observer: Observer<string> = null;//申明的时候搞成空就行

constructor() {
    Observable.create(observer => this._observer = observer).debounceTime(200).subscribe(filter => this.search(filter));//构造的时候，那么就是将Observable.create的给自己申明的_observer即可，然后延迟订阅，200就是ms的时间。然后再订阅即可。search()只是一个方法，自己想写啥写啥。
}

get filter(): string {
return this._filter;
}

set filter(value: string) {
    this._filter = value;
    this._observer.next(value);//有输入了，有变化了，调一下next就行了，它到时间了，才会调用真实的处理方法search()的。
}

10.保存成无后缀名：
const blob = new Blob(fileData, { type: 'application/octet-stream' });//加这个type是很关键的
saveAs(blob, f.name);

最后编辑于：2018.05.25 18:58:58