Question

我一直致力于一个需要在应用内打开网站的项目。所以，我使用Cordova InAppBrowse进行离子3。问题是，我收到错误显示解析错误。

在index.html上

<div style="text-align: center;">

  <button ion-button type="button" (click)="open('https://coins4ar.com/{{coinsGroup.symbol}}/')">More Info
</button>
  </div>

在index.ts上

import { InAppBrowser } from '@ionic-native/in-app-browser';

@Component({
  selector: 'page-index',
  templateUrl: 'index.html'
})
export class IndexPage {
  constructor(public navCtrl: NavController, public navParams: NavParams, private iab: InAppBrowser,
    private data: DataProvider, public http: HttpClient) {
  }

coinsGroup = [];


ionViewDidLoad() {

    this.coinsGroup = this.navParams.data;  

  }
open(url:string) {  
    let browser = this.iab.create(url,'_blank', 'location=yes');
    browser.show();
  }

}

我收到错误

VM66652 vendor.js:100970 Uncaught Error: Template parse errors:
Parser Error: Got interpolation ({{}}) where expression was expected at column 27 in [open('https://coins4ar.com/{{coinsGroup.symbol}}/')] in ng:///AppModule/IndexPage.html@190:39 ("
    -->

      <button ion-button type="button" [ERROR ->](click)="open('https://coins4ar.com/{{coinsGroup.symbol}}/')">More Info</button>
  </div>

"): ng:///AppModule/IndexPage.html@190:39
    at syntaxError (VM64228 vendor.js:100970)
    at TemplateParser.parse (VM64228 vendor.js:125153)
    at JitCompiler._parseTemplate (VM64228 vendor.js:135106)
    at JitCompiler._compileTemplate (VM64228 vendor.js:135081)
    at VM64228 vendor.js:134982
    at Set.forEach (<anonymous>)
    at JitCompiler._compileComponents (VM64228 vendor.js:134982)
    at VM64228 vendor.js:134852
    at Object.then (VM64228 vendor.js:100959)
    at JitCompiler._compileModuleAndComponents (VM64228 vendor.js:134851)

使用Anchor Tag时工作正常，但它会在应用程序之外启动网站。

Answer 1

我相信你的问题就在这一行

(click)="open('https://coins4ar.com/{{coinsGroup.symbol}}/')"

您需要将其更改为

(click)="open('https://coins4ar.com/'+coinsGroup.symbol+/')"

您可以在此处找到工作示例解决方案https://stackblitz.com/edit/angular-qp3xhw

更新

或者如果您有权访问ts文件中的coinsGroup，请执行此操作

(click)="openLink()"

并在您的ts文件中

openLink() {
  const url = `https://coins4ar.com/${this.coinsGroup.symbol}/`;
  ... open page from here
}

模板解析错误在App Browser IONIC 3中

1 个答案:

更新