Cloudinary & Angular：“cl-transformation”是未知元素答案

【问题标题】：Cloudinary & Angular: 'cl-transformation' is not known elementCloudinary & Angular：“cl-transformation”是未知元素
【发布时间】：2018-09-02 02:59:14
【问题描述】：

我想为图像添加 cl 转换，但出现此错误：

'cl-transformation' 是未知元素

这是我目前尝试过的：

在 intro.html 中：

<cl-image public-id="sample" cloud-name="test" >
    <cl-transformation effect="shadow"><cl-transformation>
</cl-image>

intro.module.ts：

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { IntroPage } from './intro';
import {FileUploadModule } from 'ng2-file-upload';
import { Ng2CloudinaryModule } from 'ng2-cloudinary';

@NgModule({
  declarations: [
      IntroPage,
  ],
  imports: [
      IonicPageModule.forChild(IntroPage),
      FileUploadModule,
      Ng2CloudinaryModule    => seems necessary for cl-image
   ]
})
export class IntroPageModule {}

结果（OKAY）：

<cl-image public-id="sample" cloud-name="test" >
</cl-image>

但是使用“cl-transformation”然后我得到这个错误：

我也试过了：

在 app.module.ts 中：

import { CloudinaryModule, CloudinaryConfiguration } from '@cloudinary/angular';
import { Cloudinary } from 'cloudinary-core';

...
imports:[
   CloudinaryModule.forRoot({Cloudinary}, { cloud_name: 'test' } as CloudinaryConfiguration),
]

但我明白了：

OpaqueToken 不是构造函数

我最后也尝试了：

intro.ts：

import {CloudinaryImageComponent} from 'ng2-cloudinary';

（文档说：此指令允许显示 Cloudinary 图像并应用转换）

但是还是不行……

有什么想法吗？

【问题讨论】：

标签： angular typescript cloudinary

【解决方案1】：

您似乎正在将 Cloudinary 的 SDK 与另一个外部 SDK (https://github.com/ekito/ng2-cloudinary) 混合使用。外部的可能根本没有组件。

如果您使用 Cloudinary 的 SDK，它应该是（假设 Angular 5）导入 { CloudinaryModule, CloudinaryConfiguration } from '@cloudinary/angular-5.x';

【讨论】：

是的，我昨天看到这个外部的没有cl-transformation，它可以节省时间但它非常有限，无论如何感谢您的回答:)

【解决方案2】：

只需使用这些更新的包，更高级并更新到 Angular 5+

cloudinary_angular

cloudinary-core

【讨论】：