angular 4 从模板上的函数访问模板上下文变量

Question

我的代码是（我不是在写对我的问题没有用的代码）：

myComponent.component.ts

/* some imports */  

@Component({
  /* some code */
})

export class GenericListComponent implements OnInit, OnDestroy {

    sliceFrom: number; // I want to use this variable on a function on my template

    constructor(/* some stuff */) { }

    myFunction(stuff: number) {
        this.sliceFrom = 15*stuff
    }

}

如您所见，我可以在组件模板中访问 sliceFrom 的值，但不能在函数内部访问：

myComponent.component.html

<!-- here it works fine  -->
<p>The value of my variable is: {{ sliceFrom }}</p>

<!-- here it is not working  -->
<tr *ngFor='let item of elements.slice({{ sliceFrom }}, {{ sliceFrom + 14 }})'>

我需要将 sliceFrom 的值传递给打字稿的 slice() 方法，以便对列表的数组进行分页。但它不起作用..我也试过使用这样的引号：

<tr *ngFor='let item of elements.slice('{{ sliceFrom }}', '{{ sliceFrom + 14 }}')'>

但它不起作用。所以我的问题是：如何将变量传递给组件模板上的 function？

感谢所有愿意帮助我的人:)

Answer 1

澄清我的评论：

改变这个：

<tr *ngFor='let item of elements.slice({{ sliceFrom }}, {{ sliceFrom + 14 }})'>

为此：

<tr *ngFor='let item of elements.slice(sliceFrom, sliceFrom + 14)'>

它应该可以工作。

在*ngFor中不做{{ elements }}，sliceFrom也一样。

angular 4 从模板上的函数访问模板上下文变量

angular 4 access template context variable from a funcion on template

typescript

angularjs-directive

angular-cli