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的值传递给typescript的slice（）方法，以便对我的列表数组进行分页。但它不起作用..我也试过使用这样的引号：

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

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

感谢所有想要帮助我的人：）

Answer 1

澄清我的评论：

改变这个：

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

对此：

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

它应该有用。

你不能{{ elements }} *ngFor sliceFrom与AUTH_USER_MODEL一样。

角度4访问模板的上下文变量来自模板上的函数

1 个答案: