Question

我有两个页面组件使用相同的方法，但使用两个不同的类型类除外。这两个组件称为服务和用户。两个组件都使用非常相似的模板，但它显示的类属性信息除外。在两个控制器上重复方法似乎效率低下，有没有办法组合/共享控制器。

Services.ts

import { Component } from '@angular/core';
import { CORE_DIRECTIVES } from '@angular/common'; 
const template = require('./service.component.html');
const style = require('./service.component.css'); 

interface Service {
    id: number;
    name: string;
    summary: string;
    path: string; 
}; 

@Component({
  selector: 'admin-services',
  directives: [ CORE_DIRECTIVES],
  template: template,
  styles: [ style ]
})

export class ServiceComponent {
  services = Services; 
  selectedService:Service ; 
  constructor() {
  }

  onselect(service:Service){
    this.selectedService = service ; 
  }
  onEdit(service:Service){
    console.log("Edit: "+service); 
  }
  onDelete(service:Service){
      console.log("Delete: "+service);
  }
  onView(service:Service){
    console.log("View: "+service); 
  }
  onAdd(){
    this.selectedService = <Service>{}; 
  }
}

User.ts

import { Component } from '@angular/core';
import { CORE_DIRECTIVES } from '@angular/common'; 
const template = require('./users.component.html');
const style = require('./users.component.css'); 

interface User {
    id: number;
    image: string;
    name: string;
    email: string;
    role: string; 
}; 

@Component({
  selector: 'admin-users',
  directives: [ CORE_DIRECTIVES],
  template: template,
  styles: [ style ]
})

export class UsersComponent {
  users = Users; 
  selectedUser:User ; 
  constructor() {
  }

  onselect(user:User){
    this.selectedUser = user ; 
  }
  onEdit(user:User){
    console.log("Edit: "+user); 
  }
  onDelete(user:User){
      console.log("Delete: "+user);
  }
  onView(user:User){
    console.log("View: "+user); 
  }
  onAdd(){
    this.selectedUser = <User>{}; 
  }
}

Answer 1

是的，这是Angular的组件驱动设计和Typescripts的类驱动设计真正闪耀的地方：

如上所述定义了struct MyProgress { //1 enum PlistError: ErrorType { case FileNotWritten case FileDoesNotExist } //2 let name:String //3 var sourcePath:String? { guard let path = NSBundle.mainBundle().pathForResource(name, ofType: "plist") else { return .None } return path } //4 var destPath:String? { guard sourcePath != .None else { return .None } let dir = NSSearchPathForDirectoriesInDomains(.DocumentDirectory, .UserDomainMask, true)[0] return (dir as NSString).stringByAppendingPathComponent("\(name).plist") } init?(name:String) { //1 self.name = name //2 let fileManager = NSFileManager.defaultManager() //3 guard let source = sourcePath else { return nil } guard let destination = destPath else { return nil } guard fileManager.fileExistsAtPath(source) else { return nil } //4 if !fileManager.fileExistsAtPath(destination) { //5 do { try fileManager.copyItemAtPath(source, toPath: destination) } catch let error as NSError { print("Unable to copy file. ERROR: \(error.localizedDescription)") return nil } } } //1 func getValuesInPlistFile() -> NSDictionary?{ let fileManager = NSFileManager.defaultManager() if fileManager.fileExistsAtPath(destPath!) { guard let dict = NSDictionary(contentsOfFile: destPath!) else { return .None } return dict } else { return .None } } //2 func getMutablePlistFile() -> NSMutableDictionary?{ let fileManager = NSFileManager.defaultManager() if fileManager.fileExistsAtPath(destPath!) { guard let dict = NSMutableDictionary(contentsOfFile: destPath!) else { return .None } return dict } else { return .None } } //3 func addValuesToPlistFile(dictionary:NSDictionary) throws { let fileManager = NSFileManager.defaultManager() if fileManager.fileExistsAtPath(destPath!) { if !dictionary.writeToFile(destPath!, atomically: false) { print("File not written successfully") throw PlistError.FileNotWritten } } else { throw PlistError.FileDoesNotExist } } } class ProgressFunctions { static func saveProgressData (plistName: String, dictName:String, dataName:String, dataValue: AnyObject) { if let myProgressPlist = MyProgress(name: plistName) { let dict = myProgressPlist.getMutablePlistFile()! //let savingDict = dict[dictName]![dataName]! //dict[dictName] = dataValue print(dict) do { try myProgressPlist.addValuesToPlistFile(dict) } catch { print(error) } } } }，您只需扩展该类并为其附加不同的组件元数据：

ServicesComponent

Answer 2

我相信您可以使用一组方法创建服务并传入一个对象。然后将对象强制转换为所需的类，并在方法中使用它。

Angular2 - 共享组件控制器

2 个答案: