Tag: angular

Angular 2.1.0dynamic创build子组件

我正在试图做的angular 2.1.0正在创build应该注入到父组件的飞行中的子组件。 例如，父组件是lessonDetails ，它包含所有课程的共享内容，例如button，如Go to previous lesson ， Go to next lesson以及其他内容。 基于路由参数，应该是子组件的课程内容需要dynamic注入父组件 。 子组件（课程内容）的HTML被定义为外部的纯string，它可以是如下的对象： export const LESSONS = { "lesson-1": `<p> lesson 1 </p>`, "lesson-2": `<p> lesson 2 </p>` } 通过innerHtml在父组件模板中可以很容易地解决问题。 <div [innerHTML]="lessonContent"></div> 如果每次路由参数变化，父组件的属性lessonContent将改变（内容（新模板）将从LESSON对象中取得），导致父组件模板被更新。 这个工程，但angular将不处理通过innerHtml注入的内容，所以不可能使用routerLink和其他的东西。 在新的angular度释放之前，我使用来自http://blog.lacolaco.net/post/dynamic-component-creation-in-angular-2/的解决scheme解决了这个问题，其中我一直使用ComponentMetadata和ComponentResolver一起创build子组件苍蝇，就像： const metadata = new ComponentMetadata({ template: this.templateString, }); 其中templateString作为子组件的Input属性传递给子组件。 MetaData和ComponentResolver都在angular 2.1.0被弃用/删除。 所以问题不仅在于dynamic组件的创build，就像在几个相关的SO问题中所描述的一样，如果我为每个课程内容定义了组件，问题将会更容易解决。 这意味着我需要为100个不同的课程预先声明100个不同的组件。 弃用的元数据提供的行为就像在单个组件的运行时更新模板（创build和销毁路由参数更改中的单个组件）。 更新1：在最近的angular度版本中，似乎需要dynamic创build/注入的所有组件都需要在entryComponents中的@NgModule预定义。 所以在我看来，与上面的问题相关，如果我需要有100课（需要dynamic地创build组件），这意味着我需要预先定义100个组件 更新2：基于更新1，可通过以下方式通过ViewContainerRef.createComponent()完成： // […]

如何在Angular 2中创build一个单例服务？

我已经读过注入引导应该有所有的孩子共享相同的实例，但我的主要和头组件（主要应用程序包括头部组件和路由器出口）每个获得我的服务单独的实例。 我有一个FacebookService，我用来调用Facebook的JavaScript API和使用FacebookService的UserService。 这是我的引导： bootstrap(MainAppComponent, [ROUTER_PROVIDERS, UserService, FacebookService]); 从我的日志logging看起来像bootstrap调用完成，然后我看到FacebookService，然后在每个构造函数代码运行，MainAppComponent，HeaderComponent和DefaultComponent之前创buildUserService：

三angular函数如何工作？

因此，在高中math，也许大学，我们被教导如何使用trig函数，他们做什么，他们解决什么样的问题。 但他们一直以黑匣子的forms呈现给我。 如果你需要正弦或余弦的东西，你打你的计算器上的罪或COSbutton，你就被设置。 这很好。 我想知道的是通常如何实现三angular函数。

如何在angular度2testing版的服务中有效地使用Http组件？

我正在尝试使用Angular 2-beta ，我想使用Http组件。 但是这里有一个严重的问题： 我读了这个 ，我知道Angular 2（不同于Angular 1）， Http组件不是一个返回Promise的服务。 它返回一个叫Observable的东西。 我们知道一个Component最好不要直接使用Http 。 有效的方法是制作一个负责使用Http的服务 。 但是怎么样？ 如果这个在完成请求后返回一个承诺？ （看这里 ） 这是否有意义？！

Angular 2 – 直接从Observable返回数据

我一直在试图弄明白这个问题，而我一直在嘲弄我的头脑，没有任何我能读的文件给了我一个答案。 我有一个直接和API通话的服务，并返回一个可观察的事件，在正常情况下，我会订阅并按照我所希望的方式来处理这些数据，但是在一个利用来自平静服务请求的辅助服务中，我需要能够从请求中返回值。 getSomething() { return this._restService.addRequest('object', 'method').run() .subscribe( res => { res; }, err => { console.error(err); } ); } returnSomething() { return this.getSomething(); } 在上面的快速示例中，我想知道是否有任何方法可以从getSomething()中的getSomething()返回res 。 如果这样做是不可行的，还有什么办法呢？ 我会补充说，_restService是非常依赖，我真的不想开始搞乱。

select – >选项抽象

在Python，Java和其他一些Selenium绑定中， select->option结构是一个Select类 ，这是一个非常方便的抽象。 例如，假设有以下select标签： <select id="fruits" class="select" name="fruits"> <option value="1">Banana</option> <option value="2">Mango</option> </select> 以下是我们如何在Python中操作它： from selenium.webdriver.support.ui import Select select = Select(driver.find_element_by_id('fruits')) # get all options print select.options # get all selected options print select.all_selected_options # select an option by value select.select_by_value('1') # select by visible text select.select_by_visible_text('Mango') 换句话说，这是一个非常透明和易于使用的抽象 。 是否有可能以类似的方式操纵量angular器中的select标签？ 这不是如何select下拉protractorjs e2etesting或如何点击在量angular器testingselect框中的选项的副本？ 。

如何在Angular 2中使用* ngFor迭代

我想在Angular 2中使用* ngFor迭代[object object]。 问题是对象不是对象的数组，而是包含更多对象的对象的对象。 { <– this is an array of object "data": { "id": 834, "first_name": "GS", "last_name": "Shahid", "phone": "03215110224", "role": null, "email": "test@example.com", "picture": **{ <– I want to get thumb: url but not able to fetch that** "url": null, "thumb": { "url": null } }, "address": "Nishtar Colony", "city_id": 2, […]

量angular器e2etesting案例下载pdf文件

谁能告诉我如何编写testing用例链接使用茉莉花框架下载PDF文件？ 提前致谢。

在AngularJS服务中caching承诺对象

我想要使​​用Promises在AngularJS中实现一个静态资源的dynamic加载。 问题：我有几个组件可能（或不是，取决于哪些显示，因此dynamic）需要从服务器获取静态资源。 一旦加载，它可以被caching整个应用程序的生活。 我已经实现了这个机制，但是我对Angular和Promises是新的，我想确定这是否是一个正确的解决scheme。 var data = null; var deferredLoadData = null; function loadDataPromise() { if (deferredLoadData !== null) return deferredLoadData.promise; deferredLoadData = $q.defer(); $http.get("data.json").then(function (res) { data = res.data; return deferredLoadData.resolve(); }, function (res) { return deferredLoadData.reject(); }); return deferredLoadData.promise; } 所以，只有一个请求被创build，接下来所有对loadDataPromise（）的调用都会返回第一个作出的承诺。 好像在进行中的要求或者前一个已经完成的要求。 但是cachingPromise是一个好的解决scheme吗？

将外部css样式加载到Angular 2组件中

import {Component} from 'angular2/core'; @Component({ selector: 'my-app', template: '<div></div>', styleUrls: [ 'http://domain.com/external.css', 'app/local.css' ] }) export class AppComponent {} external.css不加载。 有什么办法来加载Angular 2组件的外部CSS？