相关疑难解决方法(0)

是否可以在AngularJS控制器中创建HTML片段并在视图中显示此HTML？

这需要将不一致的JSON blob转换为嵌套的id : value对列表.因此,HTML是在控制器中创建的,我现在希望显示它.

我创建了一个模型属性,但是如果不打印HTML,则无法在视图中呈现它.

更新

似乎问题来自角度渲染创建的HTML作为引号内的字符串.将试图找到解决这个问题的方法.

示例控制器:

var SomeController = function () {

    this.customHtml = '<ul><li>render me please</li></ul>';
}

示例视图:

<div ng:bind="customHtml"></div>

给:

<div>
    "<ul><li>render me please</li></ul>"
</div>

我想动态创建模板.这应该用于ComponentType在运行时构建一个并在托管组件内部放置(甚至替换)它.

直到我使用RC4 ComponentResolver,但RC5我收到消息:

ComponentResolver不推荐用于动态编译.使用ComponentFactoryResolver连同@NgModule/@Component.entryComponents或ANALYZE_FOR_ENTRY_COMPONENTS提供商,而不是.对于仅运行时编译,您也可以使用Compiler.compileComponentSync/Async.

我发现了这个(官方的angular2)文件

Angular 2同步动态组件创建

并了解我可以使用其中之一

• 一种动态的ngIf用ComponentFactoryResolver.如果我将已知组件传递到托管内部@Component({entryComponents: [comp1, comp2], ...})- 我可以使用.resolveComponentFactory(componentToRender);
• 真正的运行时编译,带Compiler...

但问题是如何使用它Compiler？上面的注释说我应该打电话:Compiler.compileComponentSync/Async- 那怎么样？

例如.我想为一种设置创建(基于一些配置条件)这种模板

<form>
   <string-editor
     [propertyName]="'code'"
     [entity]="entity"
   ></string-editor>
   <string-editor
     [propertyName]="'description'"
     [entity]="entity"
   ></string-editor>
   ...

在另一种情况下这个(string-editor被替换text-editor)

<form>
   <text-editor
     [propertyName]="'code'"
     [entity]="entity"
   ></text-editor>
   ...

等等(editors属性类型的不同数量/日期/引用,跳过一些用户的某些属性......).即这是一个例子,真正的配置可以生成更多不同和复杂的模板.

该 …

我从HTTP调用中获取大量HTML代码.我将HTML块放在一个变量中并使用[innerHTML]将其插入到我的页面中,但我无法设置插入的HTML块的样式.有没有人有任何建议如何实现这一目标？

@Component({selector: 'calendar',
template: '<div [innerHTML]="calendar"></div>',
providers:[HomeService], 
styles: [` 
h3 {color:red;}
`})

我想要设置样式的HTML是变量"calendar"中包含的块.

编辑:澄清任何只撇去标题的人,我的问题是关于Angular 2,而不是1.

我有一个组件模板,如下所示:

<div>{{ post.body }}</div>

对象是这样的:

{
    "title": "Some Title",
    "body": "<p>The <em>post body</em>.</p>"
}

而不是像下面那样渲染段落:

该帖子体

它显示:

"<p>The <em>post body</em>.</p>"

由于它是如此常见的任务,我寻找一个内置的管道,{{ post.body | safe }}但没有看到一个.

是否有一种简单的方法可以实现这一目标？是否有一种安全的方法来实现这一目标？

在我的角度4应用程序中,我有一个字符串

comment: string;
comment = "<p><em><strong>abc</strong></em></p>";

当我在我的HTML中提供这个文本时,就像

{{comment}}

然后它显示:

<p><em><strong>abc</strong></em></p>

但我需要以粗体和斜体形式显示文本"abc",如 abc

我怎样才能做到这一点？

我一直在玩弄角2在过去的几天,不知道是否有可能提供一个动态templateUrl的@View装饰.

我试过传递一个函数并返回一个字符串形式,但整个函数只是变成了一个字符串.

我之前没有真正使用过Angular 1.x所以我不知道我是否只是以错误的方式解决这个问题,但是这有可能,还是有更好的方法来创建动态视图？

例如,如果用户未登录,我可能希望显示表单,但如果他们已登录则显示文本消息.

这样的东西不起作用:

@Component({
  selector: 'my-component'
})
@View({
  // This doesn't work
  templateUrl: function() {
    return this.isLoggedIn ? 'logged-in.html' : 'logged-out.html';
  }
})
class MyComponent {
  constructor() {
    this.loggedIn = false;
  }
}

任何帮助,将不胜感激.

我使用Angular 2.0.0-beta.0,我想直接创建和绑定一些简单的HTML.是可能的,怎么样？

我试着用

{{myField}}

但myField中的文本将被转义.

对于Angular 1.xi发现了ng-bind-html的命中,但这似乎不支持2.x.

弗兰克

风格如

<div [style.background-image]="\'url(\' + image + \')\'">Background</div>
<div [style.transform]="rotate(7deg)"

不再添加

我的问题,当我使用innererHtml绑定时 - angular2删除所有样式属性.这对我来说很重要,因为在我的任务中 - html是在服务器端生成的,具有所有样式.例:

@Component({
  selector: 'my-app',
  template: `
    <input type="text" [(ngModel)]="html">
    <div [innerHtml]="html">
    </div>
  `,
})
export class App {
  name:string;
  html: string;
  constructor() {
    this.name = 'Angular2'
    this.html = "<span style=\"color:red;\">1234</span>";
  }
}

但是在DOM中我只看到1234而且这个文本不是红色的.

http://plnkr.co/edit/UQJOFMKl9OwMRIJ38U8D?p=preview

谢谢!

我在这样的angularjs中使用了ng-bind

<div ng-bind="getVal()"></div>

其中,getVal()返回一定的价值,它是在控制器中.但是在Angular2中,我getVal()在组件中有一个函数,我需要从模板中调用它,就像angular1一样.

我试过了

<div [(ngModel)]="getVal()"></div>

但没有运气,任何想法？