以前在我的Angular2 RC5应用程序中,我有一个输入元素,如下所示:
<input type="text" formControlName="blah" disabled/>
Run Code Online (Sandbox Code Playgroud)
目的是使用户在编辑模式下不可编辑该字段; 因此禁用属性.
升级到Angular2 RC6后,我在控制台中收到以下消息:
看起来您正在使用带有反应式表单指令的disabled属性.如果在组件类中设置此控件时将disabled设置为true,则实际将在DOM中为您设置disabled属性.我们建议使用此方法来避免"检查后更改"错误.
例:
Run Code Online (Sandbox Code Playgroud)form = new FormGroup({ first: new FormControl({value: 'Nancy', disabled: true}, Validators.required), last: new FormControl('Drew', Validators.required) });
但是,如果我遵循此建议,删除我的禁用属性并将我的FormControl替换为禁用设置为true,那么该字段不会在提交时发布(即它不会出现在form.value中).
我是否错误地编码了这种情况?是否有一种方法可以将禁用的FormControl包含在表单值中?
作为旁注,我实际上正在使用FormBuilder而不是设置每个FormControl,如果这有所不同.
我开始研究使用Angular2和我遇到的一个我无法找到解决方案的问题.我要求根据我从模型中收到的数据,我希望为给定的组件加载不同的模板.这主要与根据我收到的数据维护不同的布局有关.这可能吗?
谢谢
我正在使用Slick Slider并希望将3个滑块同步到一起.
我有一个问题的JSfiddle:
https://jsfiddle.net/rk0tuoy7/1/
HTML:
<section class="slider">
<div>slide1</div>
<div>slide2</div>
<div>slide3</div>
<div>slide4</div>
<div>slide5</div>
<div>slide6</div>
</section>
<section class="slider2">
<div>slide1</div>
<div>slide2</div>
<div>slide3</div>
<div>slide4</div>
<div>slide5</div>
<div>slide6</div>
</section>
<section class="slider3">
<div>slide1</div>
<div>slide2</div>
<div>slide3</div>
<div>slide4</div>
<div>slide5</div>
<div>slide6</div>
</section>
Run Code Online (Sandbox Code Playgroud)
JS:
$(".slider").slick({});
$(".slider2").slick({ asNavFor: '.slider' });
$(".slider3").slick({ asNavFor: '.slider2' });
Run Code Online (Sandbox Code Playgroud)
我可以让滑块1与滑块2同步,我可以让滑块2与滑块3同步,但我不能让所有3个一起工作.有没有办法让这个工作?
谢谢
我有一个列表,显示有时可能包含HTML的数据
<li *ngFor="let result of results">
<span [innerHTML]="result.question.title">
</span>
</li>
Run Code Online (Sandbox Code Playgroud)
使用的问题innerHTML是HTML被解析和渲染,所以像<p>标签这样的东西会增加边距并破坏列表的对齐.
我想剥离所有的html标签,只输出纯文本.
像这样的方法:
<li *ngFor="let result of results">
<span>
{{result.question.title}}
</span>
</li>
Run Code Online (Sandbox Code Playgroud)
不剥离HTML,它只是将HTML作为纯文本输出.
如何剥离HTML并将纯文本保留为"Angular"方式?
我有一个使用 webpacker 设置的 react-rails 应用程序。
我正在尝试使用来自 node_modules 的字体加载 font-awesome-pro。
我认为这是一项微不足道的任务,但我似乎找不到关于如何执行此操作的任何好的文档。
这是我到目前为止:
package.json 依赖项:
"dependencies": {
"@rails/webpacker": "3.5",
"babel-preset-react": "^6.24.1",
"bootstrap": "^4.1.3",
"prop-types": "^15.6.2",
"react": "^16.5.2",
"react-dom": "^16.5.2",
"react-slick": "^0.23.1",
"react_ujs": "^2.4.4",
"slick-carousel": "^1.8.1",
"tachyons-z-index": "^1.0.9"
},
"devDependencies": {
"@fortawesome/fontawesome-pro": "^5.2.0",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-preset-env": "^1.7.0",
"file-loader": "^2.0.0",
"path": "^0.12.7",
"webpack-dev-server": "2.11.2"
}
Run Code Online (Sandbox Code Playgroud)
文件.js:
var path = require('path');
module.exports = {
test: /\.(woff(2)?|eot|otf|ttf|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
exclude: path.resolve(__dirname, '../../app/assets'),
use: {
loader: 'file-loader',
options: {
outputPath: 'fonts/',
useRelativePath: false
}
}
}
Run Code Online (Sandbox Code Playgroud)
环境.js
const { …Run Code Online (Sandbox Code Playgroud) angular ×3
html ×1
javascript ×1
jquery ×1
react-rails ×1
ruby ×1
slick.js ×1
webpack ×1
webpacker ×1