2016-03-25 17 views
1

ben klasör modellerinde Alan adı verilen bu modülü/area_getter.ts vardır:ihracat/ithalat modülü çalışmıyor typescript

class SearchFilterViewModel { 
    _regionGetter: Area.SingleSelectAreaGetter; 
    _townGetter: SingleSelectAreaGetter; 
    _suburbGetter: MultipleSelectAreaGetter; 
    _categories: KnockoutObservableArray<Category>; 
    _selectedCategories: KnockoutObservableArray<Category>; 

    constructor() { 
     this._categories = ko.observableArray([ 
      new Category("Vegan Meat", 1), 
      new Category("Vegan Dairy", 2), 
      new Category("Confectionary", 3), 
      new Category("Baking", 4), 
      new Category("Dessert", 5), 
      new Category("Restaurants", 6), 
      new Category("Grocers", 7) 
     ]); 
     this._selectedCategories = ko.observableArray([]); 
     this._regionGetter = new Area.SingleSelectAreaGetter(Area.Type.Region); 
     this._townGetter = new SingleSelectAreaGetter(Type.Town); 
     this._suburbGetter = new MultipleSelectAreaGetter(Type.Suburb); 
     this._regionGetter.getAreas("2186224"); 
     //this._regionGetter._selectedAreaGeonameId.subscribe(this._townGetter.getAreas.bind(this._townGetter)); 
     //this._townGetter._selectedArea.subscribe(this._suburbGetter.getAreas.bind(this._suburbGetter)); 
    } 
} 
: Ben view_models/search_view_model.ts bunu kullanmaya çalıştığınızda Sonra

export module Area { 
    interface iGetAreas { 
     _areasList: Array <any> ; 
     _areas: KnockoutObservableArray <string> ; 
     getAreas(geonameId: string): void; 
    } 



    export abstract class AreaGetter implements iGetAreas { 
     _areasList: Array <any> = []; 
     _areas = ko.observableArray([]); 
     _selectedAreaName: KnockoutObservable <string> ; 
     _selectedAreaGeonameId: KnockoutObservable <string> ; 
     _type: Area.Type; 

     constructor(type: Area.Type) { 
      this._type = type; 
      this._selectedAreaGeonameId = ko.observable(''); 
      this._selectedAreaName = ko.observable(''); 
      this._selectedAreaName.subscribe((newValue) => { 
       console.log(newValue); 
       console.log(this._selectedAreaGeonameId() + "  " + this._selectedAreaName()); 
      }); 
     } 

     getAreas = (geonameId: any): void => { 
      this.showLoadingIcon(); 
      this._areasList = []; 
      $.ajax({ 
       url: `http://api.geonames.org/children?geonameId=${geonameId}&username=elion` 
      }).then((allAreasXML) => { 
       this.hideLoadingIcon(); 
       var allAreasJSON = xml2json(allAreasXML); 
       var allAreas = JSON.parse(allAreasJSON); 
       if (allAreas.geonames.length) { 
        for (var index = 1; index < allAreas.geonames.length - 1; index++) { 
         this._areasList.push(allAreas.geonames[index].geoname); 
        } 
       } else { 
        if (allAreas.geonames.geoname) { 
         this._areasList.push(allAreas.geonames.geoname); 
        } else { 
         this._areasList.push({ 
          name: 'Any', 
          geonameId: 0 
         }); 
        } 
       } 
       this._areas(this._areasList); 

       if (this._type === Area.Type.Region) { 
        this._initiateRegionSelect(); 
       } 
      }); 
     } 

      _initiateRegionSelect =() => { 
      $('#region-select').multiselect({ 
       buttonWidth: '100%', 
       buttonContainer: '<div style="height: 64px;" />', 
       buttonClass: 'none', 
       nonSelectedText: "Select Region", 
       onChange: (option, checked) => { 
        var values = []; 
        $('#region-select option').each(function() { 
         if ($(this).val() !== option.val()) { 
          values.push($(this).val()); 
         } 
        }); 
        $('#region-select').multiselect('deselect', values); 
        $('#region-select').next().removeClass("open").addClass("closed"); 
        this._selectedAreaGeonameId(option.val()); 
        this._selectedAreaName(option.text()); 
       } 
      }); 
     } 

      showLoadingIcon =() => { 
      if (this._type === Area.Type.Town) { 
       $("#town-div span.multiselect-selected-text").css("visibility", "hidden"); 
       $("#town-icon").addClass('special'); 
       $("#town-icon").css("background", "url(assets/gifs/ajax-loader.gif) no-repeat"); 
       $("#town-icon").css("background-size", "100%"); 
      } else if (this._type === Area.Type.Region) { 
       $("#region-div span.multiselect-selected-text").css("visibility", "hidden"); 
       $("#region-icon").addClass('special'); 
       $("#region-icon").css("background", "url(assets/gifs/ajax-loader.gif) no-repeat"); 
       $("#region-icon").css("background-size", "100%"); 
      } else if (this._type === Area.Type.Suburb) { 
       $("#suburb-div span.multiselect-selected-text").css("visibility", "hidden"); 
       $("#suburb-icon").addClass('special'); 
       $("#suburb-icon").css("background", "url(assets/gifs/ajax-loader.gif) no-repeat"); 
       $("#suburb-icon").css("background-size", "100%"); 
      } 
     } 

      hideLoadingIcon =() => { 
      if (this._type === Area.Type.Town) { 
       $("#town-div span.multiselect-selected-text").css("visibility", "visible"); 
       $("#town-icon").removeClass('special'); 
       $("#town-icon").css("background", "transparent"); 
       $("#town-icon").css("background-size", "100%"); 
      } else if (this._type === Area.Type.Region) { 
       $("#region-div span.multiselect-selected-text").css("visibility", "visible"); 
       $("#region-icon").removeClass('special'); 
       $("#region-icon").css("background", "transparent"); 
       $("#region-icon").css("background-size", "100%"); 
      } else if (this._type === Area.Type.Suburb) { 
       $("#suburb-div span.multiselect-selected-text").css("visibility", "visible"); 
       $("#suburb-icon").removeClass('special'); 
       $("#suburb-icon").css("background", "transparent"); 
       $("#suburb-icon").css("background-size", "100%"); 
      } 
     } 
    } 

    export class MultipleSelectAreaGetter extends AreaGetter { 
     _selectedAreas = ko.observableArray([]); 
    } 

    export class SingleSelectAreaGetter extends AreaGetter { 



    } 

    export enum Type { 
     Region, 
     Town, 
     Suburb 
    } 
} 

"Bölge" tanımıyor.

Arama_görümü_model'i Alan modülünü nasıl tanıyabilirim?

import { Area } from "./models/area_getter"; gibi bir şey yapar mıydım?

enter image description here

tsconfig.json:

Bu İşte

cannot find module Area

diyerek ithalat açıklamada bir hata var benim klasör yapısı

{ 
    "compileOnSave": true, 
    "compilerOptions": { 
     "target": "es5", 
     "noImplicitAny": false, 
     "module": "system", 
     "moduleResolution": "node", 
     "sourceMap": false, 
     "emitDecoratorMetadata": true, 
     "experimentalDecorators": true, 
     "removeComments": true, 
     "outDir":"js/" 
    }, 
    "exclude": [ 
    "bower_components", 
    "node_modules", 
    "wwwroot" 
    ] 
} 
+0

nasıl görünür tsconfig.json geliyor? Commonjs kullanıyor musunuz? AMD/es6 modülü değiştirmeniz gerekiyorsa. Belirtin ve "dışarı" mı? E.g. https://github.com/ca0v/ags-lab/blob/master/tsconfig.json –

+0

@CoreyAlix Sadece tsconfig'i soruya ekledim. – BeniaminoBaggins

+0

Sanırım "outDir" doğru değil. Hepsini tek bir dosyada mı istiyorsun? Denemek". Aksi takdirde içe aktarmanız gerekir. –

cevap

0

deneyin

açık modül adı ortadan kaldırır ve ithalat içinde bunun adı sağlar "ihracat modülü Alanını {"
  • ithalat Alan = gerektiren ("./ modeller/area_getter")
  • Çıkarma

    1. .

      Yani f1:

      export interface iGetAreas { 
      } 
      
      export abstract class AreaGetter implements iGetAreas { 
      } 
      
      export class MultipleSelectAreaGetter extends AreaGetter { 
      } 
      
      export class SingleSelectAreaGetter extends AreaGetter { 
      } 
      

      f2:

      import Area = require("./f1"); 
      
      class SearchFilterViewModel { 
          _regionGetter: Area.SingleSelectAreaGetter; 
          _townGetter: Area.SingleSelectAreaGetter; 
          _suburbGetter: Area.MultipleSelectAreaGetter; 
      } 
      
    +0

    Yani herhangi bir yerde bir modül bile denememeliyim? Bu sadece bir sınıfın içe aktarımı mı? – BeniaminoBaggins

    +0

    Sınıf değil, sadece anonim bir modül. Ve belki de "ko" da ithal etmelisin? import ko = require ("./ path/to/knockout"); dışa aktarma arabirimi iGetAreas { _areasList: Array ; _areas: KnockoutObservableArray ; getAreas (geonameId: string): void; } –

    +0

    Bu hataları alıyorum:> system-csp-production.src.js: 3217 Türlenmemiş TypeError: Aynı modül dosyasında birden çok anonim System.register çağrılar file.t @ system-csp-production.src.js: 3217l .register @ system-csp-production.src.js: 3217 (anonim işlev) @ search_filter_view_model.js: 1 bootstrap_app.js: 2 Yakalanmamış ReferenceError: SearchFilterViewModel tanımlı değil İçe aktarma ifademde kırmızı dalgalı çizgiler yok. Ben import area = require ("../ models/area_getter.ts"); 'Hataları neden aldığımı biliyor musunuz? – BeniaminoBaggins