对于我的一些组件,我想改变输入字段readonly和来回的必需属性.
我已经设法获得一个正在运行的代码,它可以根据需要更改它们,但问题是它只适用于readonly,但似乎没有按要求工作:虽然元素属性更改为所需的Angular2仍然认为fieldCtrl是有效的.
这是我的plunker,我在这里说明了这个问题:https://plnkr.co/edit/Yq2RDzUJjLPgReIgSBAO?p = preview
//our root app component
import {Component} from 'angular2/core'
@Component({
selector: 'my-app',
providers: [],
template: `
<div>
<form #f="ngForm">
<button type="button" (click)="toggleReadOnly()">Change readonly!</button>
<button type="button" (click)="toggleRequired()">Change required!</button>
<input id="field" [(ngModel)]="field" ngControl="fieldCtrl" #fieldCtrl="ngForm"/>
{{fieldCtrl.valid}}
</form>
</div>
`,
directives: []
})
export class App {
constructor() {
this.name = 'Angular2'
}
toggleRequired(){
this.isRequired = !this.isRequired;
var fieldElement = <HTMLInputElement>document.getElementById('field');
if (this.isRequired){
fieldElement.required = true;
this.field = "it's required now";
}
else{
fieldElement.required = false;
this.field = …Run Code Online (Sandbox Code Playgroud) 在Angular2应用程序中创建全局键盘快捷键(也就是热键)的正确方法是什么?
让我们说好的起点就是开始工作:"?" 用于备忘单和"Alt + s"用于提交表格.
我应该映射"?" 不知何故,主要组件,然后开发属性指令,将应用于那些应该响应特定热键的组件,但是 - 如何防止输入字段响应"?".
有没有办法在Angular2 Typescript框架中复制剪贴板(多浏览器)中的文本?
我只找到使用Javascript的来源,例如
document.execCommand('copy')
Run Code Online (Sandbox Code Playgroud) Angular 2允许使用`字符来引用它们来编写多行模板.也可以将多行模板放入.html文件中并引用它templateUrl.
将模板直接放入组件中似乎很舒服,因为它只是在一个地方,但这样做有什么缺点吗?
第一种方法:
import {Component} from 'angular2/core';
@Component({
selector: 'my-app',
template: `
<h1>My First Angular 2 multiline template</h1>
<p>Second line</p>
`
})
export class AppComponent { }
Run Code Online (Sandbox Code Playgroud)
vs第二种方法:
import {Component} from 'angular2/core';
@Component({
selector: 'my-app',
templateUrl: 'multi-line.html'
})
export class AppComponent { }
Run Code Online (Sandbox Code Playgroud)
连同multi-line.html:
<h1>My First Angular 2 multiline template</h1>
<p>Second line</p>
Run Code Online (Sandbox Code Playgroud) 我正在关注Angular2快速入门并使用Node包管理器安装所需的库:https://angular.io/guide/quickstart
创建了一个package.json:
{
"name": "angular2-quickstart",
"version": "1.0.0",
"scripts": {
"tsc": "tsc",
"tsc:w": "tsc -w",
"lite": "lite-server",
"start": "concurrent \"npm run tsc:w\" \"npm run lite\" "
},
"license": "ISC",
"dependencies": {
"angular2": "2.0.0-beta.0",
"systemjs": "0.19.6",
"es6-promise": "^3.0.2",
"es6-shim": "^0.33.3",
"reflect-metadata": "0.1.2",
"rxjs": "5.0.0-beta.0",
"zone.js": "0.5.10"
},
"devDependencies": {
"concurrently": "^1.0.0",
"lite-server": "^1.3.1",
"typescript": "^1.7.3"
}
Run Code Online (Sandbox Code Playgroud)
执行
npm install
Run Code Online (Sandbox Code Playgroud)
但是npm install命令下载了很多文件,例如"node_modules\angular2"是32MB(可能是原始资源和其他东西包括在内?),尽管index.html只需要少数几个,例如angular2.dev.js只有1MB:
<!-- 1. Load libraries -->
<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
Run Code Online (Sandbox Code Playgroud)
我希望quickstart项目不占用这么多磁盘空间.有没有办法告诉npm只下载"捆绑包"或最小化版本,还是有办法在生产包装时优化node_modules目录?
有没有办法制作双向绑定输入组件,也可以在组件内部进行验证?
我想要实现的是有一个组件,我可以在我的表单中排列如下:
<form #f="ngForm">
<my-form-input [(inputModel)]="name" [inputField]="myFormInputName"></my-form-input>
<my-form-input [(inputModel)]="name2" [inputField]="myFormInputName2"></my-form-input>
...
<my-form-input [(inputModel)]="lastItem" [inputField]="lastItemName"></my-form-input>
</form>
Run Code Online (Sandbox Code Playgroud)
我有以下设置,无法弄清楚,如何使其正确:
组件:
import {Component,Input, Output,EventEmitter} from 'angular2/core'
import {FORM_DIRECTIVES} from 'angular2/common';
@Component({
selector: 'my-form-input',
directives: [FORM_DIRECTIVES],
template:
`
<input type="text" class="form-control" id="i1" required [ngModel]="inputModel" (ngModelChange)="onChangeInput($event)" ngControl="ctrl" #ctrl="ngForm"/>
<p>{{"Is field valid? I would like to make some decisions here depending on that: "+ctrl.valid}}</p>
`
})
export class InputComponent {
constructor(){};
@Input() inputField:string;
@Input() inputModel: Object;
@Output() inputModelChange = new EventEmitter();
onChangeInput(event){
this.inputModel=event;
this.inputModelChange.emit(event);
}
}
Run Code Online (Sandbox Code Playgroud)
该应用程序: …
有没有办法编写一个全局自制的mylogger函数,我可以在Angular2 typescript项目中使用我的服务或组件而不是console.log函数?
我想要的结果是这样的:
mylogger.ts
function mylogger(msg){
console.log(msg);
};
Run Code Online (Sandbox Code Playgroud)
user.service.ts
import 'commons/mylogger';
export class UserService{
loadUserData(){
mylogger('About to get something');
return 'something';
};
};
Run Code Online (Sandbox Code Playgroud) 我注意到 Oracle EXTRACT(XML) 函数在 Oracle 11g 中已弃用。
我曾经通过以下方法进行 XML 处理:
DECLARE
TYPE xmltype_table IS TABLE OF xmltype INDEX BY PLS_INTEGER;
vt_xml_tab xmltype_table;
v_xml xmltype;
BEGIN
--Generate simple XML document to pretend we received it by some interface
SELECT xmltype(dbms_xmlgen.getxml('select level, dbms_random.random rnd from dual connect by level<1000')) INTO v_xml FROM dual;
--Get nodes
SELECT VALUE(xm) xmlt BULK COLLECT INTO vt_xml_tab FROM TABLE(xmlsequence(v_xml.extract('/ROWSET/ROW/LEVEL'))) xm;
--Do whatever processing I like
FOR i IN 1..vt_xml_tab.count LOOP
dbms_output.put_line(vt_xml_tab(i).extract('LEVEL/text()').getstringval());
END LOOP;
END;
/
Run Code Online (Sandbox Code Playgroud)
由于 EXTRACT …
angular ×7
javascript ×2
typescript ×2
clipboard.js ×1
npm ×1
oracle ×1
oracle11g ×1
oracle12c ×1
xml ×1