小编Roh*_*fii的帖子

我班上有这样的功能

  showMessageSuccess(){

    var that = this;
    this.messageSuccess = true;

    setTimeout(function(){
      that.messageSuccess = false;
    },3000);

  }

我怎样才能重写这个,所以我不必在'that'var中存储对'this'的引用？如果我在setTimeout中使用'this',则messageSuccess bool似乎不会更改/获取更新.

如果我们尝试这样的代码:

<td [colspan]="1 + 1">Column</td>

或这个:

<td colspan="{{1 + 1}}">Column</td>

我们很快发现" colspan不是一个已知的原生属性".

从A2文档中我们了解到:

该元素没有colspan属性.它具有"colspan"属性,但插值和属性绑定只能设置属性,而不能设置属性.

我们必须这样做:

<td [attr.colspan]="1 + 1">Column</td>

这是公平的.

题:

我的问题是,为什么colspan不是DOM的属性,如果它缺少,浏览器怎么可能呈现表,因为浏览器呈现DOM而不是HTML？

另外,如果我打开Chrome检查器,然后转到属性选项卡,为什么我可以将colspan视为Element的属性？

为什么DOM表现出这种不一致性？

有没有办法告诉AngularJS不要显示具有ng-if指令的顶级HTML元素.我希望angular只显示子内容.

角度代码:

    <div ng-if="checked" id="div1">
      <div id="div2">ABC</div>
      <div id="div3">KLM</div>
      <div id="div4">PQR</div>
   </div>

呈现的HTML:

   <div id="div1"> 
      <div id="div2">ABC</div>
      <div id="div3">KLM</div>
      <div id="div4">PQR</div>
   </div>

我想要的是:

   <div id="div2">ABC</div>
   <div id="div3">KLM</div>
   <div id="div4">PQR</div>

这是一个小提琴.http://jsfiddle.net/9mgTS/.我不想要#div1HTML.我只是想#div2,3,4,如果checked是true.

一个可能的解决方案是将ng-if添加到所有子元素,但我不想这样做.

我开始了一个关于Angular 2.0的教程,设置工作区的第一步是安装Node.js和NPM.

为什么我们为Angular 2.0安装了Node.js？

我不记得为角度1.X做这个.

这就是我想要做的.

@Component({
   selector: "data",
   template: "<h1>{{ getData() }}</h1>"
})

export class DataComponent{
    this.http.get(path).subscribe({
       res => return res;
    })
}

如果getData在里面调用DataComponent,你可以建议将它分配给变量,this.data = res并使用我喜欢{{data}}.但是我需要像{{getData}}我自己的目的一样使用.请建议我？

我正在开发一个POC应用程序,我正在努力让MdDialog组件正常运行.有没有人有一个传递给MdDialogopen方法的工作示例？

Angular 2.0:https: //github.com/angular/angular

Angular 2材料:https: //github.com/angular/material2

按照本教程: Android -如果我使MainActivity.java按钮OnClick属性具有该sendMessage()方法,则启动另一个活动.

但是,如果我使MainActivity.kt按钮OnClick属性没有任何显示,只需一个none.

这是一个Android Studio 3错误还是我错过了Kotlin的东西？

Java mainActivity:

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    /** Called when the user taps the Send button */
    public void sendMessage(View view) {
        // Do something in response to button
    }

}

Kotlin主要活动:

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
    }

    /** Called when …

我正在使用node和webpack将图形设计公司的HTML模板工作到我的Angular 2项目中.

HTML提取各种脚本,如下所示:

<script src="js/jquery.icheck.min.js"></script>
<script src="js/waypoints.min.js"></script>

所以我在我的组件中要求它们:

var icheckJs = require('../js/jquery.icheck.min');
var waypointsJs = require('../js/waypoints.min');

还有其他一些脚本和一些SASS似乎正常工作.

webpack很高兴并且构建了一切,'npm start'也很成功.但是,当它到达浏览器时,我得到了这个投诉:

Uncaught ReferenceError: require is not defined node_modules/angular2/platform/browser.js:1 Uncaught ReferenceError: require is not defined

这个行实际上是从url.js抛出的:

var punycode = require('punycode');

这是CommonJs要求吗？几个星期前我还没有在Web开发中使用过这个,所以我还在解决webback的各种需求,CommonJs等.

我的webpack.config.js中.js加载器的摘录如下所示:

{ test: /\.js$/, loader: 'script' }

我该如何解决此错误？

我的应用程序中出现了一个奇怪的错误.它应该{{thing.title}}从一个对象打印出来,但它在控制台中显示错误:

EXCEPTION: TypeError: l_thing0 is undefined in [{{thing.title}} in AppComponent@4:44]

我不确定从哪里来l_thing0.如果我尝试{{thing}}在页面中显示,则会显示[object Object].如果我尝试JSON.stringify(this.thing)(参见该showObj()函数),它会正确显示字符串化对象.但是,如果我尝试访问属性,就像{{thing.title}}我得到l_thing0未定义的错误.

这是app.component.ts:

import {Component, OnInit} from 'angular2/core';
import {Thing} from './thing';
import {ThingService} from './thing.service';
import {SubThingComponent} from "./subthing.component";

@Component({
    selector: 'thing-app',
    template: `
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h1>{{thing.title}} <a href="#" (click)="showObj()" class="btn btn-default">Show Stringified Obj</a></h1>
                    <subthing></subthing>
                </div>
            </div>
        </div>
    `,
    styles:[`

    `],
    directives: [SubThingComponent],
    providers: [ThingService]
})

export class AppComponent …

试图缩小项目的编译源代码以进行生产,我正在使用Gulp作为任务运行者.

源文件看起来像这样,

HTML

<!--... . .  various scripts and styles . . . . . --->
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="node_modules/angular2/bundles/router.dev.js"></script>
<script src="node_modules/angular2/bundles/http.dev.js"></script>

<script>
  System.config({
    packages: {        
      app: {
        format: 'register',
        defaultExtension: 'js'
      }
    }
  });
  System.import('app/main')
        .then(null, console.error.bind(console));
</script>
</head>
<body>
  <app></app>
</body>

我的app目录结构如下,

.
??? main.js
??? main.js.map
??? main.ts
??? main.app.js
??? main.app.js.map
??? main.app.ts
??? x.component1
?   ??? x.component.one.js
?   ??? x.component.one.js.map
?   ??? x.component.one.ts
??? x.component2
    ??? x.component.two.js
    ??? x.component.two.js.map
    ??? x.component.two.ts

应用程序/ main.ts

import {bootstrap} …