Angular ERROR NullInjectorError: R3InjectorError(AppModule)的错误分析

错误消息：

外观如下：

需要注入加了@Inject(‘apiUrl’)这个注解的myname参数：

遇到如下错误：

依赖注入的入口函数：

/**
 * @fileoverview added by tsickle
 * Generated from: packages/core/src/render3/instructions/di.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @template T
 * @param {?} token
 * @param {?=} flags
 * @return {?}
 */
function ɵɵdirectiveInject(token, flags = InjectFlags.Default) {
    /** @type {?} */
    const lView = getLView();
    // Fall back to inject() if view hasn't been created. This situation can happen in tests
    // if inject utilities are used before bootstrapping.
    if (lView == null)
        return ɵɵinject(token, flags);
    /** @type {?} */
    const tNode = getPreviousOrParentTNode();
    return getOrCreateInjectable((/** @type {?} */ (tNode)), lView, resolveForwardRef(token), flags);
}

这个token是自动传入的：

从injector的records map里查看，apiUrl对应的value为null：

最终报错：

core.js:6242 ERROR NullInjectorError: R3InjectorError(AppModule)[apiUrl -> apiUrl -> apiUrl]:
NullInjectorError: No provider for apiUrl!
at NullInjector.get (http://localhost:4200/vendor.js:62758:27)
at R3Injector.get (http://localhost:4200/vendor.js:76765:33)
at R3Injector.get (http://localhost:4200/vendor.js:76765:33)
at R3Injector.get (http://localhost:4200/vendor.js:76765:33)
at NgModuleRef$1.get (http://localhost:4200/vendor.js:94067:33)
at Object.get (http://localhost:4200/vendor.js:91801:35)
at getOrCreateInjectable (http://localhost:4200/vendor.js:66560:39)
at Module.ɵɵdirectiveInject (http://localhost:4200/vendor.js:80581:12)
at NodeInjectorFactory.SearchInputComponent_Factory [as factory] (http://localhost:4200/main.js:1432:174)
at getNodeInjectable (http://localhost:4200/vendor.js:66705:44)

要获取更多Jerry的原创文章，请关注公众号"汪子熙":