Skip to content

NgtArgs

There are entities in THREE.js ecosystem that requires Constructor Arguments to be passed in like OrbitControls. Or there are entities that require reconstructing when Constructor Arguments changed like the Geometries.

let geometry = new BoxGeometry(); // [1, 1, 1] box
mesh.geometry = geometry;
// later when we want a bigger box
mesh.geometry.dispose(); // dispose old box
// construct new box
geometry = new BoxGeometry(2, 2, 2); // [2, 2, 2] box
mesh.geometry = geometry;

To achieve this, Angular Three provides the NgtArgs structural directive.

<ngt-mesh>
<ngt-box-geometry *args="boxArgs" />
</ngt-mesh>

When boxArgs changes, NgtArgs will destroy the current BoxGeometry instance and reconstruct a new one.

NgtArgs accepts an array of Constructor Arguments that the entity accepts.

<ngt-box-geometry *args="[width, height, depth, widthSegments, heightSegments, depthSegments]" />
<ngt-instanced-mesh *args="[geometry, material, count]" />
<ngt-instanced-mesh *args="[undefined, undefined, count]">
<ngt-box-geometry />
<ngt-mesh-standard-material />
</ngt-instanced-mesh>
<ngt-spot-light>
<ngt-vector2 *args="[2048, 2048]" attach="shadow.mapSize" />
</ngt-spot-light>

Please consult THREE.js documentation for details about the entities and their arguments.