Angular5+Three.js 无法读取未定义的属性“Scene1”答案

【问题标题】：Angular5+Three.js Cannot read property 'Scene1' of undefinedAngular5+Three.js 无法读取未定义的属性“Scene1”
【发布时间】：2017-12-22 16:46:28
【问题描述】：

我有一个与 Three.js 集成的 angular5 网站。当我想将对象添加到场景时，出现以下错误：无法读取未定义的属性“场景 1”。应该定义场景，有什么想法吗？

renderer = new THREE.WebGLRenderer();
public scene = null;
camera = null;
mesh = null;
THREE.Loader.Handlers.add( /\.dds$/i, new THREE.DDSLoader );
var mtlLoader = new THREE.MTLLoader();
            mtlLoader.setPath( '../../assets/obj/' );
            mtlLoader.load( 'SkyboxSky.mtl', function( materials ) {
                materials.preload();
                var objLoader = new THREE.OBJLoader();
                objLoader.setMaterials( materials );
                objLoader.setPath( '../../assets/obj/' );
                objLoader.load( 'SkyboxSky.obj', function ( object ) {
                    object.position.y = 0;
                    this.scene.add( object );
                }, onProgress, onError );
            });

但如果在此之后添加一些示例对象，则将其添加到场景中没有问题。

【问题讨论】：

我猜这是某种异步错误，并且在您尝试添加对象之前没有构建场景。
有道理，但是您知道如何等待加载完成吗？可能有等待功能吗？我尝试在该行代码之前设置像scene = new THREE.Scene(); 这样的场景，但没有成功。

标签： javascript angular module three.js

【解决方案1】：

试试这个，

renderer = new THREE.WebGLRenderer(); 
public scene = null; 
camera = null; 
mesh = null;
this.scene = new THREE.Scene();
var scope = this;
THREE.Loader.Handlers.add( /\.dds$/i, new THREE.DDSLoader ); 
var mtlLoader = new THREE.MTLLoader(); 
mtlLoader.setPath( '../../assets/obj/' ); 
mtlLoader.load( 'SkyboxSky.mtl', function( materials ) { 
    materials.preload(); 
    var objLoader = new THREE.OBJLoader(); 
    objLoader.setMaterials( materials ); 
    objLoader.setPath( '../../assets/obj/' ); 
    objLoader.load( 'SkyboxSky.obj', function ( object ) { 
        object.position.y = 0; 
        scope.scene.add( object ); 
    }, onProgress, onError ); 
});

【讨论】：

我发现了问题。问题是没有正确安装角度