错误TS2345:类型'this'的参数不能分配给类型'Item'的参数

时间:2018-11-30 06:39:20

标签: javascript angular typescript

我正在尝试将一个开源项目编译到我的本地角度,它会引发以下错误

  

src / app / blu_src / items / item.ts(111,29)中的错误:错误TS2345:类型“ this”的参数不能分配给类型“ Item”的参数。     类型“项目”不可分配给类型“项目”。存在两种使用此名称的不同类型,但是它们是无关的。       类型具有私有属性“场景”的单独声明。

打字稿版本:2.7.2

代码是:

scene.ts

   public removeItem(item: Item, dontRemove?: boolean) {
      dontRemove = dontRemove || false;
      // use this for item meshes
      this.itemRemovedCallbacks.fire(item);
      item.removed();
      this.scene.remove(item);
      if (!dontRemove) {
        Utils.removeValue(this.items, item);
      }
    }

item.ts

private scene: Scene;

   public remove() {
      this.scene.removeItem(this);
    };

实际代码为:

item.ts

 import * as THREE from 'three';
import {Utils} from "../core/utils"; 
import {Model} from "../model/model";
import {Metadata} from "../items/metadata";
import {Scene} from "../model/scene";

  /**
   * An Item is an abstract entity for all things placed in the scene,
   * e.g. at walls or on the floor.
   */
  export abstract class Item extends THREE.Mesh {

    /** */
    private scene: Scene;

    /** */
    private errorGlow = new THREE.Mesh();

    /** */
    private hover = false;

    /** */
    private selected = false;

    /** */
    private highlighted = false;

    /** */
    private error = false;

    /** */
    private emissiveColor = 0x444444;

    /** */
    private errorColor = 0xff0000;

    /** */
    private resizable: boolean;

    /** Does this object affect other floor items */
    protected obstructFloorMoves = true;

    /** */
    protected position_set: boolean;

    /** Show rotate option in context menu */
    protected allowRotate = true;

    /** */
    public fixed = false;

    /** dragging */
    private dragOffset = new THREE.Vector3();

    /** */
    protected halfSize: THREE.Vector3;
    geometry:any;
    material:any;
    castShadow:any;
    receiveShadow:any;
    position:any;
    rotation:any;
    scale:any;


    constructor(protected model: Model, public metadata: Metadata, geometry: THREE.Geometry, material: THREE.MeshFaceMaterial, position: THREE.Vector3, rotation: number, scale: THREE.Vector3) {
      super();

      this.scene = this.model.scene;
      this.geometry = geometry;
      this.material = material;

      this.errorColor = 0xff0000;

      this.resizable = metadata.resizable;

      this.castShadow = true;
      this.receiveShadow = false;

      this.geometry = geometry;
      this.material = material;

      if (position) {
        this.position.copy(position);
        this.position_set = true;
      } else {
        this.position_set = false;
      }

      // center in its boundingbox
      this.geometry.computeBoundingBox();
      this.geometry.applyMatrix(new THREE.Matrix4().makeTranslation(
        - 0.5 * (this.geometry.boundingBox.max.x + this.geometry.boundingBox.min.x),
        - 0.5 * (this.geometry.boundingBox.max.y + this.geometry.boundingBox.min.y),
        - 0.5 * (this.geometry.boundingBox.max.z + this.geometry.boundingBox.min.z)
      ));
      this.geometry.computeBoundingBox();
      this.halfSize = this.objectHalfSize();

      if (rotation) {
        this.rotation.y = rotation;
      }

      if (scale != null) {
        this.setScale(scale.x, scale.y, scale.z);
      }
    };

    /** */
    public remove() {
      this.scene.removeItem(this);
    };

    /** */
    public resize(height: number, width: number, depth: number) {
      var x = width / this.getWidth();
      var y = height / this.getHeight();
      var z = depth / this.getDepth();
      this.setScale(x, y, z);
    }

    /** */
    public setScale(x: number, y: number, z: number) {
      var scaleVec = new THREE.Vector3(x, y, z);
      this.halfSize.multiply(scaleVec);
      scaleVec.multiply(this.scale)
      this.scale.set(scaleVec.x, scaleVec.y, scaleVec.z);
      this.resized();
      this.scene.needsUpdate = true;
    };

    /** */
    public setFixed(fixed: boolean) {
      this.fixed = fixed;
    }

    /** Subclass can define to take action after a resize. */
    protected abstract resized();

    /** */
    public getHeight = function () {
      return this.halfSize.y * 2.0;
    }

    /** */
    public getWidth = function () {
      return this.halfSize.x * 2.0;
    }

    /** */
    public getDepth = function () {
      return this.halfSize.z * 2.0;
    }

    /** */
    public abstract placeInRoom();

    /** */
    public initObject = function () {
      this.placeInRoom();
      // select and stuff
      this.scene.needsUpdate = true;
    };

    /** */
    public removed() {
    }

    /** on is a bool */
    public updateHighlight() {
      var on = this.hover || this.selected;
      this.highlighted = on;
      var hex = on ? this.emissiveColor : 0x000000;
      console.log("printing the this.material",this.material);
      (<THREE.MeshFaceMaterial>this.material).forEach((material) => {
        // TODO_Ekki emissive doesn't exist anymore?
        (<any>material).emissive.setHex(hex);
      });
    }

    /** */
    public mouseOver() {
      this.hover = true;
      this.updateHighlight();
    };

    /** */
    public mouseOff() {
      this.hover = false;
      this.updateHighlight();
    };

    /** */
    public setSelected() {
      this.selected = true;
      this.updateHighlight();
    };

    /** */
    public setUnselected() {
      this.selected = false;
      this.updateHighlight();
    };

    /** intersection has attributes point (vec3) and object (THREE.Mesh) */
    public clickPressed(intersection) {
      this.dragOffset.copy(intersection.point).sub(this.position);
    };

    /** */
    public clickDragged(intersection) {
      if (intersection) {
        this.moveToPosition(
          intersection.point.sub(this.dragOffset),
          intersection);
      }
    };

    /** */
    public rotate(intersection) {
      if (intersection) {
        var angle = Utils.angle(
          0,
          1,
          intersection.point.x - this.position.x,
          intersection.point.z - this.position.z);

        var snapTolerance = Math.PI / 16.0;

        // snap to intervals near Math.PI/2
        for (var i = -4; i <= 4; i++) {
          if (Math.abs(angle - (i * (Math.PI / 2))) < snapTolerance) {
            angle = i * (Math.PI / 2);
            break;
          }
        }

        this.rotation.y = angle;
      }
    }

    /** */
    public moveToPosition(vec3, intersection) {
      this.position.copy(vec3);
    }

    /** */
    public clickReleased() {
      if (this.error) {
        this.hideError();
      }
    };

    /**
     * Returns an array of planes to use other than the ground plane
     * for passing intersection to clickPressed and clickDragged
     */
    public customIntersectionPlanes() {
      return [];
    }

    /** 
     * returns the 2d corners of the bounding polygon
     * 
     * offset is Vector3 (used for getting corners of object at a new position)
     * 
     * TODO: handle rotated objects better!
     */
    public getCorners(xDim, yDim, position) {

      position = position || this.position;

      var halfSize = this.halfSize.clone();

      var c1 = new THREE.Vector3(-halfSize.x, 0, -halfSize.z);
      var c2 = new THREE.Vector3(halfSize.x, 0, -halfSize.z);
      var c3 = new THREE.Vector3(halfSize.x, 0, halfSize.z);
      var c4 = new THREE.Vector3(-halfSize.x, 0, halfSize.z);

      var transform = new THREE.Matrix4();
      //console.log(this.rotation.y);
      transform.makeRotationY(this.rotation.y); //  + Math.PI/2)

      c1.applyMatrix4(transform);
      c2.applyMatrix4(transform);
      c3.applyMatrix4(transform);
      c4.applyMatrix4(transform);

      c1.add(position);
      c2.add(position);
      c3.add(position);
      c4.add(position);

      //halfSize.applyMatrix4(transform);

      //var min = position.clone().sub(halfSize);
      //var max = position.clone().add(halfSize);

      var corners = [
        { x: c1.x, y: c1.z },
        { x: c2.x, y: c2.z },
        { x: c3.x, y: c3.z },
        { x: c4.x, y: c4.z }
      ];

      return corners;
    }

    /** */
    public abstract isValidPosition(vec3): boolean;

    /** */
    public showError(vec3) {
      vec3 = vec3 || this.position;
      if (!this.error) {
        this.error = true;
        this.errorGlow = this.createGlow(this.errorColor, 0.8, true);
        this.scene.add(this.errorGlow);
      }
      this.errorGlow.position.copy(vec3);
    }

    /** */
    public hideError() {
      if (this.error) {
        this.error = false;
        this.scene.remove(this.errorGlow);
      }
    }

    /** */
    private objectHalfSize(): THREE.Vector3 {
      var objectBox = new THREE.Box3();
      objectBox.setFromObject(this);
      return objectBox.max.clone().sub(objectBox.min).divideScalar(2);
    }

    /** */
    public createGlow(color, opacity, ignoreDepth): THREE.Mesh {
      ignoreDepth = ignoreDepth || false
      opacity = opacity || 0.2;
      var glowMaterial = new THREE.MeshBasicMaterial({
        color: color,
        blending: THREE.AdditiveBlending,
        opacity: 0.2,
        transparent: true,
        depthTest: !ignoreDepth
      });

      var glow = new THREE.Mesh(<THREE.Geometry>this.geometry.clone(), glowMaterial);
      glow.position.copy(this.position);
      glow.rotation.copy(this.rotation);
      glow.scale.copy(this.scale);
      return glow;
    };
  }

scene.ts

import * as THREE from 'three';
import {Utils} from "../core/utils";
import {Item} from "../Items/item";
import {Factory} from "../items/factory";
import {Model} from "../model/model";
declare var $: any;


  /**
   * The Scene is a manager of Items and also links to a ThreeJS scene.
   */
  export class Scene {

    /** The associated ThreeJS scene. */
    private scene: THREE.Scene;

    /** */
    private items: Item[] = [];

    /** */
    public needsUpdate = false;

    /** The Json loader. */
    private loader: THREE.JSONLoader;

    /** */
    private itemLoadingCallbacks = $.Callbacks();

    /** Item */
    private itemLoadedCallbacks = $.Callbacks();

    /** Item */
    private itemRemovedCallbacks = $.Callbacks();

    /**
     * Constructs a scene.
     * @param model The associated model.
     * @param textureDir The directory from which to load the textures.
     */
    constructor(private model: Model, private textureDir: string) {
      this.scene = new THREE.Scene();

      // init item loader
      this.loader = new THREE.JSONLoader();
      this.loader.crossOrigin = "";
    }

    /** Adds a non-item, basically a mesh, to the scene.
     * @param mesh The mesh to be added.
     */
    public add(mesh: THREE.Mesh) {
      this.scene.add(mesh);
    }

    /** Removes a non-item, basically a mesh, from the scene.
     * @param mesh The mesh to be removed.
     */
    public remove(mesh: THREE.Mesh) {
      this.scene.remove(mesh);
      Utils.removeValue(this.items, mesh);
    }

    /** Gets the scene.
     * @returns The scene.
     */
    public getScene(): THREE.Scene {
      return this.scene;
    }

    /** Gets the items.
     * @returns The items.
     */
    public getItems(): Item[] {
      return this.items;
    }

    /** Gets the count of items.
     * @returns The count.
     */
    public itemCount(): number {
      return this.items.length
    }

    /** Removes all items. */
    public clearItems() {
      var items_copy = this.items
      var scope = this;
      this.items.forEach((item) => {
        scope.removeItem(item, true);
      });
      this.items = []
    }

    /**
     * Removes an item.
     * @param item The item to be removed.
     * @param dontRemove If not set, also remove the item from the items list.
     */
    public removeItem(item: Item, dontRemove?: boolean) {
      dontRemove = dontRemove || false;
      // use this for item meshes
      this.itemRemovedCallbacks.fire(item);
      item.removed();
      this.scene.remove(item);
      if (!dontRemove) {
        Utils.removeValue(this.items, item);
      }
    }

    /**
     * Creates an item and adds it to the scene.
     * @param itemType The type of the item given by an enumerator.
     * @param fileName The name of the file to load.
     * @param metadata TODO
     * @param position The initial position.
     * @param rotation The initial rotation around the y axis.
     * @param scale The initial scaling.
     * @param fixed True if fixed.
     */
    public addItem(itemType: number, fileName: string, metadata, position: THREE.Vector3, rotation: number, scale: THREE.Vector3, fixed: boolean) {
      itemType = itemType || 1;
      var scope = this;
      var loaderCallback = function (geometry: THREE.Geometry, materials: THREE.Material[]) {
        var item = new (Factory.getClass(itemType))(
          scope.model,
          metadata, geometry,
          new THREE.MeshFaceMaterial(materials),
          position, rotation, scale
        );
        item.fixed = fixed || false;
        scope.items.push(item);
        scope.add(item);
        item.initObject();
        scope.itemLoadedCallbacks.fire(item);
      }

      this.itemLoadingCallbacks.fire();
      this.loader.load(
        fileName,
        loaderCallback,
        undefined // TODO_Ekki 
      );
    }
  }

0 个答案:

没有答案