Tag: angular

如何获得angular2的DOM元素: 我有一个有p元素的组件。它的onClick事件会将其更改为textarea以便用户可以编辑数据。我的问题是：我怎么能把重点放在textarea上？我怎么能到达这个元素，所以我可以appy上的.focus（）？我可以避免使用document.getElemenntById（）？我试图使用“ElementRef”和“@ViewChild（）”，但似乎我失去了一些东西： // —— THE CLASS @ViewChild('tasknoteId') taskNoteRef:ElementRef; noteEditMode: boolean = false; get isShowNote (){ return !this.noteEditMode && this.todo.note ? true : false; } taskNote: string; toggleNoteEditMode () { this.noteEditMode = !this.noteEditMode; this.renderer.invokeElementMethod(this.taskNoteRef.nativeElement,'focus'); } // —— THE COMPONENT <span class="the-insert"> <form [hidden]="!noteEditMode && todo.note"> <textarea #tasknoteId id="tasknote" name="tasknote" [(ngModel)]="todo.note" placeholder="{{ […]

Angular 2材质devise组件支持布局指令吗？: 我正在尝试使用Angular2 Material Design组件，而我无法获得任何布局指令。例：根据例子，这应该“只是工作”： <div layout="row"> <div flex>First item in row</div> <div flex>Second item in row</div> </div> <div layout="column"> <div flex>First item in column</div> <div flex>Second item in column</div> </div> 但事实并非如此 – 它只是将页面上的元素渲染为普通的旧div。（我正在使用最新版本的Chrome）。我是否错过了一些东西，比如说我应该导入一个CSS文件？

Twitter Bootstrap中的圆桌: Bootstrap 3已经在桌子上掉落了圆angular。请问我应用哪种types的应用程序，以便在我应用.table-bordered类时将它们还原？ UPDATE 到目前为止，我已经来到这个代码，没有任何效果。从Bootstrap 2.3.2获取的CSS： .table-bordered { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .table-bordered thead:first-child tr:first-child > th:first-child, .table-bordered tbody:first-child tr:first-child > td:first-child, .table-bordered tbody:first-child tr:first-child > th:first-child { -webkit-border-top-left-radius: 4px; border-top-left-radius: 4px; -moz-border-radius-topleft: 4px; } .table-bordered thead:last-child tr:last-child > th:first-child, .table-bordered tbody:last-child tr:last-child > td:first-child, .table-bordered tbody:last-child tr:last-child > th:first-child, .table-bordered […]

如何作为一个模块的孩子路由到一个模块 – Angular 2 RC 5: 我正在升级正在处理最新的Angular 2候选版本的应用程序。作为这项工作的一部分，我尝试使用NgModule规范，并将我的应用程序的所有部分迁移到模块中。除了路由问题之外，大部分情况已经非常好了。 "@angular/common": "2.0.0-rc.5", "@angular/compiler": "2.0.0-rc.5", "@angular/core": "2.0.0-rc.5", "@angular/forms": "0.3.0", "@angular/http": "2.0.0-rc.5", "@angular/platform-browser": "2.0.0-rc.5", "@angular/platform-browser-dynamic": "2.0.0-rc.5", "@angular/router": "3.0.0-rc.1", 我的应用程序是作为模块的组合构build的，有几个模块作为父模块的子模块粘在一起。例如，我有一个由通知模块，用户模块和电话模块（例如）组成的pipe理模块。这些模块的路线应该看起来像… /admin/notifications/my-notifications /admin/users/new-user /admin/telephony/whatever 在路由器的早期版本中，使用“children”很容易实现， export const AdminRoutes: RouterConfig = [ { path: "Admin", component: AdminComponent, Children: [ …UserRoutes, …TelephonyRoutes, …NotificationRoutes ] } ] 在另一个文件中，作为子模块的一部分，我也定义了单独的模块路由 export const UserRoutes: RouterConfig = [ { path: […]

在组件Angular 2中redirect: 我有一个简单的方法，在它结束时，我想redirect到另一个组件： export class AddDisplay{ display: any; addPairTo(name: string, pairTo: string){ this.display = {}; this.display.name = name; this.display.pairTo = pairTo; } } 我想要做的是在方法的最后redirect到另一个组件： export class AddDisplay{ display: any; addPairTo(name: string, pairTo: string){ this.display = {}; this.display.name = name; this.display.pairTo = pairTo; this.redirectTo('foo'); } } 我如何在Angular 2中实现这一点？

Angular2处理http响应: 我只是有一个关于构造和处理来自服务中的http请求的响应的问题。我正在使用Angular2.alpha46 Typescript （刚开始testing它 – 我爱… Ps ..感谢所有的人一直在努力，并通过github贡献）所以采取以下措施： login-form.component.ts import {Component, CORE_DIRECTIVES, FORM_DIRECTIVES} from 'angular2/angular2'; import {UserService} from '../../shared/service/user.service'; import {Router} from 'angular2/router'; import {User} from '../../model/user.model'; import {APP_ROUTES, Routes} from '../../core/route.config'; @Component({ selector: 'login-form', templateUrl: 'app/login/components/login-form.component.html', directives: [CORE_DIRECTIVES, FORM_DIRECTIVES] }) export class LoginFormComponent { user: User; submitted: Boolean = false; constructor(private userService:UserService, private […]

使用angular2更新服务中组件的可变更改: 我的应用程序有一个NameService名称。 App有两个子组件，Navbar和TheContent引用了这个服务。每当名称在服务中更改，我希望它在其他两个组件中更新。我怎样才能做到这一点？ import {Component, Injectable} from 'angular2/core' // Name Service @Injectable() class NameService { name: any; constructor() { this.name = "Jack"; } change(){ this.name = "Jane"; } } // The navbar @Component({ selector: 'navbar', template: '<div>This is the navbar, user name is {{name}}.</div>' }) export class Navbar { name: any; constructor(nameService: NameService) { […]

Angular 2 Component @Input不工作: 我被困在试图传递一个属性值到我的组件。从我看过的一切看起来都是正确的。但它仍然没有工作。我的testing值输出到屏幕和控制台为空。 🙁 这是我的testing组件： import {Component, Input} from 'angular2/angular2'; @Component({ selector: 'TestCmp', template: `Test Value : {{test}}` }) export class TestCmp { @Input() test: string; constructor() { console.log('This if the value for user-id: ' + this.test); } } 这是我从父页面调用组件的方式。 <TestCmp [test]='Blue32'></TestCmp> 当页面渲染的testing值是空的。我只看到“testing值：”。而不是“testing值：Blue32”。

我如何使用独angular兽作为“rails s”？: 一个新的rails项目的gemfile显示： # Use unicorn as the app server gem 'unicorn' rails s –help显示： Usage: rails server [mongrel, thin, etc] [options] 然而，做： rails s unicorn 我得到： /Users/patrick/.rvm/gems/ruby-1.9.3-head@keynote/gems/rack-1.4.5/lib/rack/handler.rb:63:in `require': cannot load such file — rack/handler/unicorn (LoadError) from /Users/patrick/.rvm/gems/ruby-1.9.3-head@keynote/gems/rack-1.4.5/lib/rack/handler.rb:63:in `try_require' from /Users/patrick/.rvm/gems/ruby-1.9.3-head@keynote/gems/rack-1.4.5/lib/rack/handler.rb:16:in `get' from /Users/patrick/.rvm/gems/ruby-1.9.3-head@keynote/gems/rack-1.4.5/lib/rack/server.rb:272:in `server' from /Users/patrick/.rvm/gems/ruby-1.9.3-head@keynote/gems/railties-3.2.13/lib/rails/commands/server.rb:59:in `start' from /Users/patrick/.rvm/gems/ruby-1.9.3-head@keynote/gems/railties-3.2.13/lib/rails/commands.rb:55:in `block in <top (required)>' from /Users/patrick/.rvm/gems/ruby-1.9.3-head@keynote/gems/railties-3.2.13/lib/rails/commands.rb:50:in `tap' […]

是否有任何替代ng2禁用angular2？: 我正在使用angular2进行开发，并想知道是否有任何替代ng2 ng-disabled angular2。例如。下面的代码是在angularJS中： <button ng-disabled="!nextLibAvailable" ng-click="showNext('library')" class=" btn btn-info btn-xs" title="Next Lib >> {{libraries.name}}"> <i class="fa fa-chevron-right fa-fw"></i> </button> 只是想知道我怎样才能实现这个function？任何投入？