2017-08-31 10 views
0

名前のリストが入力され、その名前をクリックすると、Google検索にリダイレクトされます。私はカスタム入力されたデータnameを、urlからhtmlに追加する際に助けが必要です。これは、Google検索の自動検索結果で訪問者をリダイレクトします。AngularDartの追加のカスタムデータを含むURLへのリダイレクト

app_component.html

 <h1>{{title}}</h1> 

    <h2>My favorite hero is: {{myHero.name}}</h2> 

    <p>Heroes:</p> 

    <ul> 

     <li *ngFor="let hero of heroes"> 

      <a href="https://www.google.co.in/search?q=">{{ hero.name }}</a> 

     </li> 

    </ul> 

app_component.dart

 import 'package:angular2/angular2.dart'; 
    import 'src/hero.dart'; 


    @Component(
     selector: 'my-app', 
     template: '''app_component.html''', 

     directives: const [CORE_DIRECTIVES],) 

     class AppComponent { 
      String title = 'Tour of Heroes'; 
      List<Hero> heroes = [ 
     new Hero(1, 'Windstorm'), 
       new Hero(13, 'Bombasto'), 
       new Hero(15, 'Magneta'), 
       new Hero(20, 'Tornado') 
     ]; 
      Hero get myHero => heroes.first; 
    } 

答えて

1

あなたがHTMLにデータをバインドするのと同じ方法で、あなたは例えば、それはHTML属性を行うバインドできます。これはうまくいくはずです。ところで

<a href="https://www.google.co.in/search?q={{ hero.name }}">{{ hero.name }}</a> 

は、ユーザーが新しいタブで検索を開き、あなたのアプリがまだ起こっていますので、同様にリンクに target="_blank"属性を追加することを検討すべきです。

+0

材料ボタンに実装する方法を教えてください –

+0

ボタンのAPIドキュメント(https://material.angular.io/components/button/overview)によれば、 click me! ' – HoBi

+0

ありがとう、申し訳ありませんが、私は angular_components。 –

関連する問題