我设置了一个新的Angular 5项目,似乎@Injectable装饰器不起作用。我必须为构造函数的每个参数手动注入@Inject decorator。 我使用Angular 5.0.5和TS 2.4.2。 这是我的tsconfig.json:
{ "compileOnSave": false, "compilerOptions": { "outDir": "./dist/out-tsc", "sourceMap": true, "declaration": false, "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true, "target": "es5", "typeRoots": [ "node_modules/@types" ], "lib": [ "es2017", "dom" ] } }
我失去了很多时间,我真的不明白会发生什么。 你对这个问题有所了解吗?
答案 0 :(得分:0)
我的猜测是你可能正在尝试注入一个界面:
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<body>
<body>
<div class="container-fluid plan-background" style="margin-top: 0%;padding-right: 0px;padding-left: 0px;">
<div class="container main_btm" style="padding-left: 0px;padding-right: 0px; ">
<div class="row top" style="margin-left: 0px;margin-right: 0px;margin-top:22px;">
<div class="col-md-5 col-sm-6 hidden-xs" class-align="right" style="margin-top: 10px;padding:left:23px; ">
</div>
<div class="col-md-3 col-sm-6 col-xs-12 mobile-property-list" style="margin-top: 10px; padding-left: 27px;"><h4 style="color:#fff;font-size:20px;"> Select Your Plan</h4></br> </div>
<div class="col-md-4 col-sm-0 hidden-xs"></div>
</div>
<div class="row mobile-filter" style="margin-top: 5px; margin-left: 0px;margin-right: 0px;margin-bottom:5%;" >
<div class="col-md-1"></div>
<div class="col-md-10 top-a rentListing" style="padding-left:0px;">
<section id="pricing-table">
<div class="row pricelistNew">
<div class="pricing">
<div class="col-md-4 col-sm-4 col-xs-12">
<div class="pricing-table">
<div class="pricing-header">
<p class="pricing-title myTitle">Easy Plan </p>
<input type="hidden" value="1 " name="plan_Id" class="plan_Id">
<p class="pricing-rate">₹ 1000 <br><span>Including All Tax</span></p>
<a class="btn btn-custom payNow">Buy Now</a>
</div>
<div class="pricing-list">
<ul>
<li>Contacts details up to : <span class='contactDetails'>05</span></li>
<li>Bonus Contact details up to : <span class="bonusContacts"> 20</span></li>
<li>Area Master Assistance : <span class='areaMaster'>No </span></li>
<li>Contact details through sms : <span class='ContactDetailsSMS'>No</span></li>
</ul>
</div>
</div>
</div>
<div class="col-md-4 col-sm-4 col-xs-12">
<div class="pricing-table">
<div class="pricing-header">
<p class="pricing-title myTitle">Cool Plan </p>
<input type="hidden" value="2 " name="plan_Id" class="plan_Id">
<p class="pricing-rate">₹ 2000 <br><span>Including All Tax</span></p>
<a class="btn btn-custom payNow">Buy Now</a>
</div>
<div class="pricing-list">
<ul>
<li>Contacts details up to : <span class='contactDetails'>50</span></li>
<li>Bonus Contact details up to : <span class="bonusContacts"> 8</span></li>
<li>Area Master Assistance : <span class='areaMaster'>Yes</span></li>
<li>Contact details through sms : <span class='ContactDetailsSMS'>Yes</span></li>
</ul>
</div>
</div>
</div>
<div class="col-md-4 col-sm-4 col-xs-12">
<div class="pricing-table">
<div class="pricing-header">
<p class="pricing-title myTitle">Free Plan </p>
<input type="hidden" value="3 " name="plan_Id" class="plan_Id">
<p class="pricing-rate">₹ 0 <br><span>Including All Tax</span></p>
<a class="btn btn-custom payNow" style="">Enroll Now</a>
</div>
<div class="pricing-list">
<ul>
<li>Contacts details up to : <span class='contactDetails'>25</span></li>
<li>Bonus Contact details up to : <span class="bonusContacts"> 2</span></li>
<li>Area Master Assistance : <span class='areaMaster'>No </span></li>
<li>Contact details through sms : <span class='ContactDetailsSMS'>Yes</span></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<div class="col-md-1 "></div>
</div>
</div>
需要constructor(someDependency: SomeInterface) { /* ... */ }
装饰器。
如果您正在尝试注入课程:
@inject
constructor(someDependency: SomeClass) { /* ... */ }
注释应该足够了。
在Is it possible to inject interface with angular2?
了解详情如果这不是您的问题,那么您的项目可能存在问题。也许您不止一次导入@injectable
模块?
答案 1 :(得分:0)
我的不好,我刚发现问题...... 我在polyfill.js中评论了'core-js / es7 / reflect'导入。
谢谢你