使用 AngularDart 中的其他自定义数据重定向到 Url

Question

一个名称列表被填充，当点击该名称时，它会重定向到谷歌搜索。我需要帮助通过 html 将自定义填充数据 name 添加到 url，这将使用 Google 搜索的自动搜索结果重定向访问者。

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;
     }

Answer 1

与将数据绑定到 HTML 的方式相同，您可以将其绑定到 HTML 属性，例如。这应该工作。

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

顺便说一句，您应该考虑将target="_blank" 属性也添加到链接中，这样用户将在新标签页中打开搜索，您的应用程序仍将继续运行。