角度错误:赋值表达式的左侧必须是变量或属性访问

时间:2017-11-21 12:58:46

标签: angular angular4-forms

不明白或不知道如何解决此错误。

这是代码。它似乎与我认为的pushItem功能有关。



> **app.component.ts**

import { Component, NgModule } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  //bind this array to li in html
  items = ['Sistema', 'Playstation', 'Web'];

  newItem = '';

  pushItem = function() {
    if(this.newItem ! = ''){
      this.items.push(this.newItem);
      this.newItem = '';
    }
  }


}

@import '~font-awesome/css/font-awesome.css';

.main{
    width: 500px;
    text-align: center;
    margin: 0 auto;
    border: 2px solid #d7d7d7;
    border-bottom: 0px;
    margin-top: 20px;
    font-family: sans-serif;
}

h1{
    text-align: center;
    background-color: #5c8297;
    padding: 30px 0px;
    margin-top: 0px;
    color: #f7f7f7;
}

.addItem{
    position: relative;
    padding-bottom: 0px;
    height: 30px;
}

.addText{
    width: 80%;
    height: 30px;
    padding: 5px;
    font-size: 20px;
}

 button{
    height: 45px;
    width: 50px;
    padding: 5px;
}

ul{
    list-style: none;
    font-size: 20px;
    color: #686868;
    margin-left: -40px;
    margin-bottom: 0px;
}

li{
    border-bottom: 1px solid #bfbfbf;
    background: #d7d7d7;
    padding: 10px 0px;
    margin-bottom: 5px;
}

span{
    cursor: pointer;
    position: relative;
    float: right;
    margin-right: 15px;
}

> **app.component.html**

<div class = 'main'> 
  <h1>Item List</h1>
  <div class = 'add'>
    <input [(ngModel)] = 'newItem' placeholder="add item" class = 'addText'>
    <button>Add</button>
  </div>
  <ul>
    <Li *ngFor = 'let i of items'>
      {{i}} 
      <span><i class="fa fa-times" aria-hidden="true"></i></span>
    </Li>
  </ul> 
</div>
&#13;
&#13;
&#13;

Error nessage

2 个答案:

答案 0 :(得分:3)

我认为你应该替换

if(this.newItem ! = ''){

通过

if(this.newItem != ''){

之间有空格!和=

答案 1 :(得分:-1)

尝试从 newItem = '' 生成 newItem = []。并且还尝试修改您的 pushItem = function() 因为它没有在其中获取 newItem 。此外,在最新版本的 angular 中, [(ngModel)] 未绑定,因为它不是 known property 。所以让它成为[价值]。